@charset "utf-8";

.wrap{margin:auto}
header{z-index:998}
header nav#lnb .close,
header .gnb>ul.etc>li.allmenu, header .gnb>ul.etc>li.lang  {display:none;}

.sorae_allmenu{display:none; position:fixed; left:0px; top:0px; width:100%; height:100%; background:rgba(0,0,0,.8); z-index:999}
.sorae_allmenu .wrap{position:relative; margin:5% auto; padding:3% 5% 3%; max-width:1200px; background:#fff; border-radius:10px}
.sorae_allmenu .wrap>ul{margin-top:30px; overflow:hidden}
.sorae_allmenu .wrap>ul>li{float:left; text-align:center; margin:2%; width:29.3%; border-top:2px solid #1d528f}
.sorae_allmenu .wrap>ul>li>a{display:block; padding:20px 10px; font-size:1.2em; color:#1d528f; font-weight:bold}
.sorae_allmenu .wrap>ul>li .submenu{display:block !important}
.sorae_allmenu .wrap>ul>li .submenu p{display:none}
.sorae_allmenu .wrap>ul>li .submenu ul{border-top:1px solid #1d528f}
.sorae_allmenu .wrap>ul>li .submenu ul li{padding:12px; border-top:1px dotted #888}
.sorae_allmenu .wrap>ul>li .submenu ul li:first-child{border-top:0px;}
.sorae_allmenu .wrap .family_mb{display:none}
.sorae_allmenu .wrap p.close_soraeAll{text-align:center}
.sorae_allmenu .wrap p.close_soraeAll a{display:inline-block; margin-top:20px; padding:10px 40px 15px; background:#2d85d0; color:#fff; font-weight:bold; font-size:1.2em; border-radius:2px}

footer{position:relative; padding:40px 0px; background:#e2e2e2}
footer:after{display:block; content:''; clear:both}
footer .btm_logo{float:left; margin-top:1%; width:20%; margin-right:3%}
footer .btm_con{float:left; width:70%}
footer .btm_con>p{margin-top:5px; letter-spacing:0px}
footer .btm_con>p.copy{margin-top:30px}

p.btn_goTop{position:absolute; right:5%; bottom:180px; transition:all ease 1s}
p.btn_goTop.fade{bottom:200px;}
p.btn_goTop a{display:block; width:75px; height:75px; border-radius:80px; border:5px solid #333; box-shadow:0px 1px 2px rgba(0,0,0,.5), inset 0px 1px 2px rgba(0,0,0,.5); text-indent:-5000px}
p.btn_goTop a:before,
p.btn_goTop a:after{display:block; content:''; position:absolute; left:16px; top:33px; width:28px; height:5px; background:#333; transform:rotate(-45deg); -webkit-transform:rotate(-45deg); border-radius:2px; box-shadow:0px 1px 2px rgba(0,0,0,.5)}
p.btn_goTop a:after{margin-left:17px; transform:rotate(45deg); -webkit-transform:rotate(45deg)}


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


@media all and (min-width:801px){
	.dp_mb{display:none}
	.pc_block{display:block}
	
	header{position:relative}
	header:before {display:block; content:""; position:absolute; left:0; right:0; top:40px; height:1px; background:#e8e8e8;}	
	header:after{display:block; content:''; clear:both}
	header .gnb{margin:auto; left:0px; padding:9px 0px; width:100%}
	header .gnb:after{display:block; content:''; clear:both}
	header h1{float:left; margin-top:15px; width:20%}
	header h2{display:none}
	header nav#lnb{float:right; width:80%}
	header nav#lnb>div>ul{text-align:right; padding-right:90px}
	header nav#lnb>div>ul:after {display:block; content:""; clear:both;}
	header nav#lnb>div>ul>li{display:inline-block; position:relative; vertical-align:top; padding-left:9%}
	header nav#lnb>div>ul>li:nth-child(3){padding-right:4.5%}
	header nav#lnb>div>ul>li>a {position:relative; display:block; padding:30px 0px 33px; font-size:1.75em; letter-spacing:-2px; color:#222;  z-index:100;}
	header nav#lnb .submenu{display:none}
	header nav#lnb .submenu>div{display:none}
	header nav#lnb .submenu ul{position:absolute; left:18%; top:98px; text-align:center; width:100%; background:#2d85d0}
	header nav#lnb>div>ul>li:nth-child(3) ul{left:13%;}
	header nav#lnb .submenu ul li{position:relative; border-top:1px solid rgba(255,255,255,.2); border-bottom:1px solid #2878bb}
	header nav#lnb .submenu ul li:first-child{border-top:0px}
	header nav#lnb .submenu ul li:hover{border-color:#1d528f}
	header nav#lnb .submenu ul li:hover:After{display:block; content:''; position:absolute; top:-2px; left:0px; width:100%; height:1px; background:#1d528f}
	header nav#lnb .submenu ul li:first-child:hover:After{display:none}
  header nav#lnb .submenu ul li:last-child{border-bottom:0px}
	header nav#lnb .submenu ul li a{display:block; padding:10px; color:#fff; font-size:1.05em; word-break:keep-all}
	header nav#lnb .submenu ul li a:hover{background:#1d528f; font-weight:bold}
	header p.tm_allmenu{position:relative; right:0px; top:0px; max-width:1400px; margin:auto}
	header p.tm_allmenu a{display:block; position:absolute; right:0px; top:-68px; width:40px; height:40px; text-indent:-5000px}
	header p.tm_allmenu a:after{display:block; content:''; position:absolute; right:0px; top:10px; width:28px; height:2px; background:#111; 
	box-shadow:0px 10px 0px #111, 0px 20px 0px #111}
	.main header #skipnav{display:none}
	.main header p.tm_allmenu{position:fixed; right:50px; top:100px; z-index:999}
	.main header p.tm_allmenu a{display:block; width:40px; height:40px; text-indent:-5000px}
	.main header.on p.tm_allmenu{position:relative; right:0px; top:0px; max-width:1400px; margin:auto}
	.main header.on p.tm_allmenu a{display:block; position:absolute; right:0px; top:-68px; width:40px; height:40px; text-indent:-5000px}	
}

@media all and (min-width:801px) and (max-width:1280px){
	.wrap{padding:0px 20px}
}

@media all and (max-width:950px){
	header nav#lnb>div>ul>li{padding-left:4%; padding-right:0px !important; }
}

@media all and (max-width:800px){
	.dp_pc{display:none}
	.mb_block{display:block}

	header{position:fixed; left:0px; top:0px; width:100%; background:#fff; box-shadow:0px 0px 2px rgba(0,0,0,.2)}
	header h1{margin:10px 0px 5px; text-align:center}
	header h1 img{max-width:210px}
 	header h2{ z-index:100}
	header h2 a{display:block; position:absolute; left:0px; top:8px; width:60px; height:60px; text-indent:-5000px}
	header h2 a:after{display:block; content:''; position:absolute; left:20px; top:20px; width:28px; height:3px; background:#1d528f; box-shadow:0px 10px 0px #1d528f, 0px 20px 0px #1d528f} 
	.main header{background:rgba(0,0,0,.5)}
 	.main header h2 a:after{background:#fff; box-shadow:0px 10px 0px #fff, 0px 20px 0px #fff} 
	header.on{background:#fff; transition:all ease .5s}
	header.on h1 img{width:160px; transition:all ease .5s}	
	header.on h2 a{top:3px}
	header.on h2 a:after{height:2px; background:#1d528f; box-shadow:0px 10px 0px #1d528f, 0px 20px 0px #1d528f}	
	footer{text-align:center; }
	footer span {display:block;}
	footer .btm_con{float:none; padding:0px 30px; width:auto;}
	#contents .wrap{padding:0px 20px}
}