@charset "utf-8";

.logo{line-height:49px; font-size:23px; font-weight:800; text-transform:uppercase; font-family:"paybooc";}

#topmenu{padding:0 0 0 480px;}
#topmenu > li{width:25%;}
#topmenu > li:last-child{display:block;}
#topmenu li .tit h2{height:auto; line-height:120%; text-align:left; padding-left:17px;}
#topmenu li .tit h2:after{right:auto; left:0;}
#topmenu .menu > ul{letter-spacing:0;}
#topmenu .menu > ul > li{display:table;}
#topmenu .menu > ul > li > a{display:table-cell; vertical-align:middle; line-height:120%;}

.btn_menu{display:none; top:38px; border-left-color:#e6e6e6;}

#footer > .inner{padding-left:440px;}
#footer address{letter-spacing:0;}

#submenu .depth2{box-shadow:none;}
#submenu .depth2 > li {display:table; width:100%; margin:0 0 5px;}
#submenu .depth2 > li > a{display:table-cell; vertical-align:middle; padding:5px 30px 5px 22px; line-height:130%; border-bottom:1px solid #d7d7d7;}
#submenu .depth2 > li > a:before{top:39px;}
#submenu .depth2 > li > a:after{right:20px;}

#pageTitle h3 {font-size: 30px;}
#submenu .sm_tit {height: 195px;}
#submenu .sm_tit h2 {font-size: 32px;}
#submenu .depth2 > li > a {font-size: 17px; letter-spacing: -1.5px;}

#container_main {margin-top: 110px;}
.location {bottom: -49px;}

@media (max-width: 1400px) {
	#pageTitle h3 {
	    font-size: 28px;
	}
}
@media (max-width: 1280px) {
    #font_control div.top_sns {margin-right: 10px;}
	#topmenu{padding:0 0 0 400px;}
	#topmenu > li{width:26%;}
	#topmenu > li:nth-child(2){width:22%;}
	#topmenu > li > a{font-size:16px; letter-spacing: -1.5px;}

	.logo{font-size:20px;}
}
@media all and (max-width:1130px) {
	.top_sns{padding:0 15px 0 0;}
}
@media all and (max-width:1024px) {
	.logo{line-height:44px; font-size:21px;}

	.btn_menu{display:block; top: 47px;}


	#top .inner{padding:0 124px 0 0;}
	#font_control{position:absolute; right:15px; top:0;}
	#font_control ul{display:none;}
	.top_sns{padding:0;}
	.top_sns a{height:37px;}
	
	.global{opacity:1; visibility:visible; position:static; width:100% !important; box-shadow:none; background:transparent; box-sizing:border-box;}
	.global > li {width:20% !important; border-top:none;}
	.global > li > a{width:100%; height:37px; padding:0; color:#555;}
	.global > li.on > a{color:#3a9fa3; font-weight:600;}
	.global > li:before{z-index:-1; content:''; display:block; position:absolute; top:50%; left:0; width:1px; height:13px; margin:-7px 0 0 0; background:#c3c4cb;}

	.m_menu > ul > li{display:table; width:47%;}
	.m_menu > ul > li > div{left:47%; width:53%;}
	.m_menu > ul > li > a{display:table-cell; vertical-align:middle; line-height:120%;}

	#footer > .inner{width:100%; padding:25px 0 30px; font-size:14px;}
	#footer .logo{position:static; display:inline-block; padding:0 0 20px;}
	#footer .logo strong{font-size:21px;}
	
	#subContent {padding-top: 35px;}

}
@media all and (max-width:900px) {
	.location {bottom: -110px; left: 10px; transform: none;}
    #subContent {padding-top: 70px;}

}
@media all and (max-width:768px) {
	#top .inner{padding:0 94px 0 0;}
	.btn_menu,
	#font_control{right:0;}

	.logo{line-height:41px; font-size:20px;}
	#footer .logo strong{font-size:20px;}

	.m_menu .logo{width:80%; line-height:120%;}
	.m_menu .logo span{width:calc(100% - 50px);}
	
	.btn_menu{top: 42px;}

}

@media all and (max-width:680px) {
    .util_wrap {bottom: -46px;}
	#subContent {padding-top: 0;}
	#pageTitle {padding: 40px 0 0;}
	.location {bottom: -176px;}
	#pageTitle {
		position: absolute;
		top: 0;
		left: 50%;
		transform: translateX(-50%);
	}
}
@media all and (max-width:568px) {
	.logo{line-height:39px; font-size:19px;}
	#footer .logo strong{font-size:19px;}
	.util_wrap {
        bottom: -24px;
    }
}
@media all and (max-width:480px) {
    .global > li {width: 22% !important;}
}
@media all and (max-width:395px) {
	.logo,
	#footer .logo strong{font-size:17px;}
	
	.global > li > a {font-size: 12px;}
}
@media all and (max-width:420px) {
    #pageTitle h3 {
        font-size: 24px;
    }
    #pageTitle {top: 10px;}
	.location {bottom: -172px;}
    .location span {font-size: 11px; padding: 0 0 0 18px; letter-spacing: -1.5px;}
}
@media all and (max-width:360px) {
	.logo{line-height:120%;}
	.logo span{width:calc(100% - 50px);}
	
	#footer .logo span{width:100%; text-align:center;}
}