#wrapper { width:100%;}

#header { width:100%;  border-top:2px solid #244875;  }
#header .top_area_1 { width:100%; margin:0 auto; background:#f5f5f5; }
#header .top_area_1 ul { max-width:1400px; margin:0 auto; display:flex; justify-content:right; }
#header .top_area_1 ul li a { color:#222; font-size:14px; padding:0 10px; line-height:35px; display:block; }
#header .top_area_2 { max-width:1400px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; padding:0px 0; }
#header .top_area_2 .top_logo { padding:0px 0; max-height:80px; max-width:320px; display:block; }
#header .top_area_2 .top_logo img { max-height:100%; max-width:100%; }

@media(max-width:1000px){
#header { border-bottom:1px solid #ddd; }
#header .top_area_2 { max-width:100%; padding:5px ; }
#header .top_area_2 .top_logo { padding:0 0px; height:50px;  }
#header .top_area_2 .top_logo img { height:50px; max-width:100%;  }
}





#nav > ul { display:flex; }
#nav > ul > li { padding:20px 10px; position:relative; }
#nav > ul > li > a { font-size:20px; color:#222; display:block; padding:10px 30px; line-height:40px; white-space:nowrap; }
#nav > ul > li > a:hover { color:#999; }
#nav > ul > li .sub { display:none; position:absolute; top:100px; left:50%; z-index:9; background:#f5f5f5; width:180px; margin-left:-90px; }
#nav > ul > li:hover .sub { display:block; }
#nav > ul > li .sub a { font-size:18px; color:#222; display:block; padding:10px 0px; text-align:center; }
#nav > ul > li .sub li:first-child { margin-top:10px; }
#nav > ul > li .sub li:last-child { margin-bottom:10px; }
#nav > ul > li .sub li:hover { background:#ddd; }

.page_toparea { height:140px; /* position:relative;overflow:hidden; */ background:#eee;  }
.page_toparea .page_title_image { height:100%; width:100%; overflow:hidden; }
.page_toparea .page_title_image img { max-width:100%; min-height:100%; object-fit:cover; }
.page_toparea h1 { position:absolute; top:0; left:0; width:100%; height:100%; color:#fff; text-align:center; font-size:30px;
display:flex; align-items:center; justify-content:center; }

@media(max-width:1000px){
.page_toparea { height:70px; }
}



.nav_loginmenu { padding:30px 0 0 0; width:100%;}
.nav_loginmenu ul { display:flex; }
.nav_loginmenu li { width:50%; }
.nav_loginmenu li:first-child { margin-right:2px; }
.nav_loginmenu a { display:block; text-align:center; background:#68bdc0; padding:8px 0; color:#fff; }



.bottom_banner { border-top:1px solid #ddd; padding:40px 0 20px 0;  }
.bottom_banner > ul { max-width:1400px; margin:0 auto;padding:25px 0 ; display:flex; justify-content:space-between;  }

@media(max-width:1000px){
.bottom_banner { border-top:1px solid #ddd; padding:20px 0;  }
.bottom_banner > ul { max-width:95%; margin:0 auto;padding:0px 0 ; display:flex; justify-content:space-between; flex-wrap:wrap; }
.bottom_banner > ul li { padding:5px; width:50%; }
}




#footer { width:100%; padding:0 0 35px 0; margin-top:0px; }
#footer .footer_inner { max-width:1400px; padding:15px 0; margin:0 auto; display:flex; align-items:center; position:relative; }
#footer .bottom_logo { flex-shrink:0; margin-right:30px; padding-bottom:30px; width:250px;  }
#footer .bottom_info { flex-grow:1; }
#footer .banner_mot { position:absolute; right:0; top:70px; width:200px; }
#footer .bottom_info ul.bottom_menu { display:flex;  border-bottom:1px solid #ddd; padding-bottom:15px; width:100%; }
#footer .bottom_info ul.bottom_menu li { margin-right:15px; }
#footer .bottom_info ul.bottom_menu li a { line-height:20px; font-size:16px; }
#footer .bottom_info ul.bottom_address { display:flex; flex-wrap:wrap; padding:15px 230px 0 0; margin-left:-10px; }
#footer .bottom_info ul.bottom_address li { padding:0 11px 0 10px; line-height:1.5em; position:relative;font-size:16px;  }
#footer .bottom_info ul.bottom_address li:after { position:absolute; right:0; top:7px; content:""; width:1px; height:10px; background:#aaa; }
#footer .bottom_info ul.bottom_address li:last-child:after { background:none; }
#footer .bottom_snslink { position:absolute; right:0; top:0; display:flex; z-index:2; }
#footer .bottom_snslink li { width:38px; height:38px; border-radius:19px; overflow:hidden; margin-right:7px; border:1px solid #ddd; }
#footer .bottom_snslink img { width:100%; }

@media(max-width:1000px){
#footer { width:100%; padding:0 0 35px 0; margin-top:0px; border-top:1px solid #ddd; }
#footer .footer_inner { max-width:100%; padding:0 0 60px 0; margin:0 auto; display:block; }
#footer .bottom_logo { position:absolute; left:20px; bottom:0; margin-right:0; padding-bottom:0px; width:140px; }
#footer .banner_mot { position:absolute; left:180px; right:auto; top:auto; bottom:0; margin:0; padding:0; width:130px; }
#footer .banner_mot img { width:100%; }
#footer .bottom_info { flex-grow:1;  }
#footer .bottom_info ul.bottom_menu { padding:10px 20px; display:flex;  border-bottom:1px solid #ddd; width:100%; }
#footer .bottom_info ul.bottom_menu li { margin-right:10px; }
#footer .bottom_info ul.bottom_menu li a { line-height:17px; font-size:12px; }
#footer .bottom_info ul.bottom_address { padding:10px 20px; display:flex; flex-wrap:wrap; margin-left:-10px; }
#footer .bottom_info ul.bottom_address li { padding:0 6px 0 5px; font-size:11px; line-height:1.5em; position:relative;  }
#footer .bottom_info ul.bottom_address li:after { display:none;}
#footer .bottom_info ul.bottom_address li:last-child:after { background:none; }
#footer .bottom_snslink { position:absolute; right:0; top:0; display:flex; z-index:2; }
#footer .bottom_snslink li { width:30px; height:30px; border-radius:15px; overflow:hidden; margin-right:7px; border:1px solid #ddd; }
#footer .bottom_snslink img { width:100%; }
}




#nav { color:#222; display:-moz-flex; display:-webkit-flex; display:-ms-flex; display:flex; /* overflow:hidden; */ position: relative; z-index: 2; }
#navPanelToggle { text-decoration: none; display: none; position: fixed; top: 5px; right: 5px;  z-index: 10001; text-indent:-999999999999px; 
background:url('../image/btn_hammenu.png') no-repeat; background-position:center center; width:50px; height:50px; }
#navPanel { -moz-transform: translateX(20rem); -webkit-transform: translateX(20rem); -ms-transform: translateX(20rem); 
transform: translateX(20rem); -moz-transition: -moz-transform 0.5s ease, box-shadow 0.5s ease, visibility 0.5s; 
-webkit-transition: -webkit-transform 0.5s ease, box-shadow 0.5s ease, visibility 0.5s;	
-ms-transition: -ms-transform 0.5s ease, box-shadow 0.5s ease, visibility 0.5s;	
transition: transform 0.5s ease, box-shadow 0.5s ease, visibility 0.5s;	
display: none;	-webkit-overflow-scrolling: touch;	background: #ffffff; box-shadow: none; color: #212931; height: 100%; max-width: 80%;
overflow-y: auto; padding: 3rem 2rem; position: fixed; right: 0; top: 0; visibility: hidden; width: 20rem; z-index: 10002; }
#navPanel .close { cursor: pointer;	display: block;	position: absolute;	right: 0px; top: 0; text-indent:-999999999999px; 
background:url('../image/btn_hammenu_close.png') no-repeat; background-position:center center; width:50px; height:50px; }
#navPanel .close:before { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal;
font-variant: normal; text-rendering: auto; line-height: 1; text-transform: none !important; font-family: 'Font Awesome 5 Free'; 
font-weight: 900; }
#navPanel .close:before { content: '\f00d';	font-size: 1.25rem;}
#navPanel .close:hover { color: #212931; }

@media screen and (max-width: 1000px) {
#navPanel { padding: 2.5rem 1.75rem; }
.panel_nav {  }
.panel_nav > ul { }
.panel_nav > ul > li { padding:10px 0px; position:relative; border-bottom:1px solid #eee; }
.panel_nav > ul > li > a { font-size:20px; color:#222; display:block; padding:0px 10px; line-height:30px; }
.panel_nav > ul > li > a:hover { color:#999; }
.panel_nav > ul > li .sub { display:none; background:#f5f5f5;}
.panel_nav > ul > li:hover .sub { display:block; }
.panel_nav > ul > li .sub a { font-size:18px; color:#222; display:block; padding:5px 15px;  }
.panel_nav > ul > li .sub li:first-child { padding-top:10px; margin-top:10px; }
.panel_nav > ul > li .sub li:last-child { padding-bottom:10px; }
}

@media screen and (max-width: 1000px) {
#navPanelToggle {display: block;}
#navPanel { display: block; }
#header .top_area_1 { display:none; }
#nav {display: none;}
body.is-navPanel-visible #wrapper { opacity: 0.5; }
body.is-navPanel-visible #navPanel {-moz-transform: translateX(0);-webkit-transform: translateX(0);	-ms-transform: translateX(0);
transform: translateX(0); box-shadow: 0 0 1.5rem 0 rgba(0, 0, 0, 0.2);visibility: visible; }
}




#wrapper > .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: auto,	auto, 100% auto;
background-position: center, center, top center; background-repeat: repeat,	no-repeat,	no-repeat; 
background-attachment: scroll, scroll,scroll; z-index: -1;}
#wrapper > .bg.fixed { position: fixed;	width: 100vw; height: 100vh;}