@charset "UTF-8";

/* *************************************************************

*   Structure CSS
*   Since:2020-07
*   Editor:ricostyle

************************************************************* */


/* ==========================================================================
   Media Queries
   ========================================================================== */


@media print,screen and (min-width:640px) {
/*USING PC*/

/* CONTENTS */
body,html{width:100%;background:url(../img_cmn/bg_upper.jpg) top repeat-x;}
container{width:100%;min-width:1080px;}

/* PAGE UP */
#page-top {position:fixed;bottom:0;right:0;}
#page-top a{display:block;width:82px;height:74px;filter:alpha(opacity=50);-moz-opacity: 0.5;opacity: 0.5;background:#364FA0 url(../img_cmn/bt_up.png) no-repeat center center;display:block;text-indent:-9999px;}
#page-top a:hover{filter:alpha(opacity=70);-moz-opacity: 0.7;opacity: 0.7;}


/* HEADER */
#header{width:1080px;margin:0 auto;position:relative;padding-top:50px;}
#header h1{position:absolute;top:20px;left:0;z-index:1000;}
#header h1 img{width:310px;height:auto;}
#header #language{position:absolute;top:5px;right:0;background:#4561C0;padding:8px 15px;}
#header #language a{color:#FFF;}
#header #language:hover{background:#587AD8;}

#header #head_contact{text-align:right;margin-top:-10px;}
#header #head_contact ul li{display:inline-block;margin-left:5px;}
#header #head_contact ul li.no1{font-size:0;}
#header #head_contact ul li.no2{font-size:0;}
#header #head_contact ul li.no3{font-size:0;display:none;}
#header #head_contact ul li.no1 a{background:url(../img_cmn/bt_head_tel_off.png) center no-repeat;width:236px;height:65px;display:block;}
#header #head_contact ul li.no2 a{background:url(../img_cmn/bt_head_mail_off.png) center no-repeat;width:160px;height:65px;display:block;}
#header #head_contact ul li.no1 a:hover{background:url(../img_cmn/bt_head_tel_on.png) center no-repeat;}
#header #head_contact ul li.no2 a:hover{background:url(../img_cmn/bt_head_mail_on.png) center no-repeat;}



/* FOOTER */
#footer{background:#364FA0;padding:20px 0;color:#FFF;}
#footer .wrap{width:1000px;position:relative;text-align:left;margin:0 auto;}

#footer #f_detail{width:650px;padding:10px 50px 0 0;border-right:1px dotted #ABB8E2;float:left;margin-bottom:25px;line-height:1.5em;font-size:0.9em;}
#footer #f_detail #f_add{margin:10px 0 20px 50px;}
#footer #f_detail #f_tel{margin-left:50px;}
#footer #f_detail #f_logo img{width:250px;height:auto;}
#footer #f_detail #f_tel img{width:195px;height:auto;margin-bottom:5px;}

#footer #f_navi{padding-left:700px;text-align:left;margin:0;line-height:1.8em;font-size:0.8em;}
#footer #f_navi ul{display:inline-block;padding:10px 0 0 40px;vertical-align:top;text-align:left;}
#footer #f_navi ul li{background:url(../img_cmn/icon_arrow4.png) no-repeat left 5px;padding-left:15px;}
#footer #f_navi ul li a{color:#FFF;}
#footer #f_navi ul li a:hover{color:#69C1F1;}

#copy{width:1080px;position:relative;text-align:center;line-height:1.8em;margin:0 auto;clear:both;}
#copy p{font-size:0.9em;}

}






@media only screen and (max-width:639px) {
/*USING SMARTPHONE TBLET*/

/* CONTENTS */
#contents{position:relative;min-height:600px;}
#contents .wrap{width:100%;padding-bottom:20px;}

/* PAGE UP */
#page-top {}
#page-top a{display:block;width:100%;height:56px;filter:alpha(opacity=50);-moz-opacity: 0.5;opacity: 0.5;background:#7287CF url(../img_cmn/bt_up.png) no-repeat center center;display:block;text-indent:-9999px;position:fixed;bottom:0;}
#page-top a:hover{filter:alpha(opacity=80);-moz-opacity: 0.8;opacity: 0.8;}


/* HEADER */
#header{width:100%;height:auto;margin:0 auto;position:relative;text-align:left;}
#header h1{z-index: 1000000;margin:10px 0 15px 10px;}
#header h1 img{width:70%;min-width:180px;max-width:300px;height:auto;z-index: 1000000;}

#header #language{display:none;height:0;visibility:hidden;}

#header #head_contact{width:100%;height:50px;text-align:center;padding:0;margin:0;}
#header #head_contact ul{width:100%;border:1px solid #FFF;}
#header #head_contact ul li{ display:inline-block;margin:0;padding:0;width:33%;text-indent:100%;white-space:nowrap;overflow:hidden;border-right:1px solid #FFF;}
#header #head_contact ul li:last-child{border-right:none;}
#header #head_contact ul li a{display:block;width:100%;height:50px;}
#header #head_contact ul li.no1 a{background:#63A5CD url(../img_cmn/icon_tel.png) center center no-repeat;background-size:auto 60%;}
#header #head_contact ul li.no2 a{background:#63A5CD url(../img_cmn/icon_mail.png) center center no-repeat;background-size:auto 50%;display:block;}
#header #head_contact ul li.no1 a:hover{background:#4A9CCF url(../img_cmn/icon_tel.png) center center no-repeat;background-size:auto 60%;}
#header #head_contact ul li.no2 a:hover{background:#4A9CCF url(../img_cmn/icon_mail.png) center center no-repeat;background-size:auto 50%;}


/* FOOTER */
#footer{background:#364FA0;color:#FFF;font-size:0.8em;padding:20px 0 0;}
#footer .wrap{width:100%;position:relative;margin:0 auto;text-align:center;}
#footer #f_detail{width:97%;line-height:1.5em;margin:0 auto 15px;}
#footer #f_detail a{display:inline-block;margin-bottom:10px;}
#footer #f_detail #f_add{margin:10px auto;width:97%;pointer-events: none;}
#footer #f_detail #f_logo img{width:75%;max-width:280px;height:auto;}
#footer #f_detail #f_tel img{width:50vw;height:auto;}
#footer #f_navi{padding:12px 5px;background:#2E4287;}
#footer #f_navi ul{display:inline-block;vertical-align:top;text-align:left;}
#footer #f_navi ul li{background:url(../img_cmn/icon_arrow4.png) no-repeat left 5px;padding-left:9px;padding-right:1em;display:inline-block;line-height:1.7em;}
#footer #f_navi ul li a{color:#FFF;font-size:0.9em;}
#footer #f_navi ul li a:hover{color:#69C1F1;}

#copy{background:#364FA0;padding:20px 0 70px;width:97%;amrgin:0 auto;}
#copy p{color:#FFF;line-height:1.6em;}


}