@charset "utf-8";

/*
================================================================================
LAYOUT
================================================================================
*/

/* Loading */
/*.loaded{background:url(../images/common/loading.gif) 50% 250px no-repeat;}*/

/* header */
#wrap {position:relative;min-width: 1450px;}
.innerWrap{position:relative;max-width: 1600px;width: 96%;margin:0 auto;}
.inner{position:relative;max-width: 1320px;width: 96%;margin:0 auto;}
@media only screen and (max-width: 1024px){ .innerWrap,.inner {width: 96%; }}
@media only screen and (max-width: 768px){ .innerWrap,.inner {max-width: inherit;width: 94%;}}
@media only screen and (max-width: 480px){ .innerWrap,.inner { width: 92%;}}

#header {width:100%;height: 120px;position:absolute;left:0;top: 0;z-index:400;}
#header a { text-decoration: none}
.headerWrap {position:relative;max-width: 1600px;width: 96%;margin:0 auto;}
.utill{height:50px;/* background: #f7f7f7; */}

.topBox{ display:none;}
.gnb_wrap{position:relative;width:100%;text-align: center;}

/* utill */
.utill{position: absolute;right: 0;top: 50px;z-index: 2;}
.utill li{float:left;padding: 0 9px;line-height: 50px;letter-spacing: -0.03em;}
.utill li:before{ content:''; display: block; float:left; width:20px; height: 50px; margin-right: 5px;}
.utill li a{position: relative;color:#fff;}
.utill li.tel:before{content:'';display:inline-block;width:20px;height: 50px;background: url('../images/common/ico_tel.png') no-repeat 50% 50%;background-size: contain;}
.utill li.tel {font-weight:700;}
.utill li.kakao{/* background:#3c1e1e; */position: relative;height: 50px;font-size:1em;padding:0;}
.utill li.kakao:before{display:none;}
.utill li.kakao a{color:#ffe800;font-weight: 500;height: 50px;display: block;padding:0 20px 0 10px;}
.utill li.kakao a:before{content:'';display: block;position: absolute;left: 0;top: 0;margin:0;width:29px;height: 50px;background: url('../images/common/sns_k.svg') no-repeat 50% 50%;}

/* logo */
.headerWrap .logo {position:absolute;top: 0px;left: 0;font-size:0;line-height:0;width: 230px;height: 120px;z-index: 2}
.headerWrap .logo a {display:block;width: 100%;height: 120px;box-sizing:border-box;background: url('../images/common/ci_w.svg') no-repeat 0 center;}
#mGnb{display: none;}
.nav-btn {cursor:pointer;width: 100%;height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;}
.nav-btn .line {background-color: #fff;display: block;height: 2px;width: 100%;transition: all 0.2s ease-in-out;}
.nav-btn .line:nth-child(2){ margin:5px 0}

/* gnb menu */
#gnb {text-align: center;margin: 0 auto;display: flex;justify-content: center;gap: 5rem;width: 100%;} /*메뉴위치*/
#gnb:after {display:block; content:""; clear:both;}
#gnb > li {/* text-align:center; */position: relative;}
#gnb > li .tit{position:relative;height: 12rem;}
#gnb > li .tit > a {color: #fff;font-size: 2.2rem;font-weight: 600;display: flex;align-items: center;justify-content: center;line-height: 15rem;padding: 0;position: relative;font-weight: 500;}
#gnb > li:first-child .tit > a {/* border-width: 0px 1px; */}
#gnb > li .tit a:hover,
#gnb > li .tit a:focus,
#gnb > li .tit a:active,
#gnb > li:hover .tit a,
#gnb > li.on .tit a {color: var(--mainColor);}
#gnb > li .tit a::after	{content:"";position: absolute;right: -14px;top: 45px;width: 7px;display: block;height: 7px;border-radius: 100px;/* padding:1px 0; */background: var(--mainColor);opacity: 0;-webkit-transition: opacity 0.2s, -webkit-transform 0.2s;-moz-transition: opacity 0.2s, -moz-transform 0.2s;transition: opacity 0.2s, transform 0.2s;z-index:9;}
#gnb > li a::after	{bottom: 0;-webkit-transform: translateY(5px);-moz-transform: translateY(5px);transform: translateY(5px);}
#gnb > li a.on::after,
#gnb > li a:hover::after,
#gnb > li a:focus::after{opacity: 1;-webkit-transform: translateY(0px);-moz-transform: translateY(0px);transform: translateY(0px);}

#gnb > li.over .tit a{color: var(--mainColor) !important;}
#gnb > li.over .tit a::after{opacity: 1;-webkit-transform: translateY(0px);-moz-transform: translateY(0px);transform: translateY(0px);}
#gnb > li:last-child{display:none;}


#gnb .depth2{position: absolute;left: 50%;top: 120px;overflow: hidden;margin:0 !important;width:100%;min-width: 150px;transition: opacity .3s, height .3s;-webkit-transition:opacity .3s, height .3s;padding: 1.5em 0;opacity:1;opacity: 0;/* transform: translateY(15px); */background: #0f0f0f;border-radius: 0 0 10px 10px;transform: translate(-50%, 15px);border-top: 3px solid var(--mainColor);}
#gnb > li.over > div {z-index:10;opacity: 1;}
#gnb > li:hover .depth2,
#gnb > li:focus .depth2,
#gnb > li.over .depth2{opacity: 1;transform: translate(-50%, 0);}
#gnb > li > .ulWrap > ul > li{color: #7c8081;text-align:center;line-height:1.4em;font-size:1em;transition:color .3s;-webkit-transition:color .3s;}
#gnb > li > div > ul > li > a {display: block;vertical-align: top;position: relative;color: rgba(255,255,255,0.8);font-size: 1.6rem;text-align: center;line-height: 1.4em;padding: 6px 0px;margin: 0;letter-spacing: -0.04em;font-weight: 500;}
#gnb > li > .ulWrap > ul > li > a:focus,
#gnb > li > .ulWrap > ul > li > a:active,
#gnb > li > .ulWrap > ul > li > a:hover{color: #fff;text-decoration: underline;}
#gnb > li > .ulWrap > ul > li > a:focus,
#gnb > li > .ulWrap > ul > li > a:active,
#gnb > li > .ulWrap > ul > li > a:hover,
#gnb > li:hover > div > ul > li:hover > a{color: var(--mainColor);font-weight:600;}
#gnb > li > .ulWrap > ul > li.target a:after{content:'';display:inline-block;margin: 0 10px;background:url('../images/common/ic_blank.gif') no-repeat 0 0;width:14px;height:14px;vertical-align: middle;}
#gnb > li > .ulWrap > ul > li.target > a:focus,
#gnb > li > .ulWrap > ul > li.target > a:active,
#gnb > li > .ulWrap > ul > li.target > a:hover{ background:none;}
#gnb > li > .ulWrap > ul > li.target a:hover:after {margin-top: 0px}

/* container */
#container {padding-top: 0px;}
#container:after {display:block; content:""; clear:both;}

/* footer */
#footer{position:relative;background: #1a1a1a;color: #95969c;word-break: keep-all;}
#footer .innerWrap{padding: 7rem 0;}

.footer_top,
.footer_bottom{display:flex;width: 100%;align-items: baseline;}
.footer_top{ }
#footer .con.left{display: flex;flex-direction: column;flex-wrap:wrap;gap: 2rem;width: 100%;}
#footer .con.right{margin-left: auto;display: flex;align-items: end;flex-direction: column;}
#footer .logo{height: 5rem;}
#footer .logo img{height:100%;}
.foot_util{display:flex;gap: 15px;}
.foot_util li{display:flex;align-items:center;position: relative;}
.foot_util li a{color: #90949a;font-size: 1.5rem;display: flex;gap: 5px;padding: 0.5rem;align-items: center;}
.foot_util li a.ico_link:after{content:'';display:inline-block;width: 13px;height: 13px;background: url('../images/common/angle-right_w.svg') no-repeat 50% 100%;opacity: 0.4;}
.foot_util li:first-child:before{ display:none;}
.foot_util li:before{content:'';display:block;width:0.3rem;height:0.3rem;background:#87898c;border-radius:0.3rem;position: absolute;left: -0.8rem;top: calc(50% - 0.15rem);}
.foot_util li a:hover,.foot_util li a:focus{ color:#fff;}
#footer .addInfo{ display:flex; flex-wrap:wrap;}
#footer .add_list{display: inline-block;/* width: 100%; */margin-top: 5px;}
#footer .add_list:first-child{margin-top: 0; width:100%}
#footer .add_list:nth-child(2){margin-right: 20px;}
#footer .add_list dt,
#footer .add_list dd{/* font-size:1.4rem; */line-height:1.5;font-weight: 400;color: #95969c;float: left;}
#footer .add_list dt{padding: 0 1rem 0 0;color: #fff;min-width: 42px;}
#footer .add_list .tt{padding: 0 0.5rem 0 1rem;color:#585b61;}

#footer .footer_bottom .con.right{ max-width:500px;}

.foot_fam{ margin-left:auto; display: flex; gap:2rem}
.foot_fam a{display:block;}
.copyright{margin-top: 2.5rem;line-height: 1.4;font-size: 1.4rem;width: 100%;}

/* btn-top */
.btn-top {position: fixed;right: 20px;bottom: -100px;width: 50px;height: 50px;border-radius: 50px;margin: 0 auto;overflow:hidden;display: block;background: #fff;box-shadow:0px 2px 10px rgba(0,0,0,0.1);-webkit-transition: all 0.6s ease;-moz-transition: all 0.6s  ease;-o-transition: all 0.6s  ease;-ms-transition: all 0.6s ease;transition: all 0.6s ease;z-index: 11;margin-top: 10px;}
.btn-top span{background: #fff url('../images/common/quick_top.svg') no-repeat 50% 50% / 30px;font-size:0;background-size: 20px;width:100%;height:100%;display:block;}
.btn-top:hover, .btn-top:focus{ box-shadow:0px 2px 10px rgba(0,0,0,0.2); } 
.btn-top.on{ bottom:20px;}



@media only screen and (max-width:1024px) {	
	body{font-size:14px;}
	.utill{width:auto;float: none;/* height: 40px; */position: absolute;right: 30px;top: 13px;overflow: hidden;border-radius: 5px;background: none;}
	.utill li{padding: 0 10px;}
	.utill li.tel{/* padding-right:5px; */}
	.utill li.kakao{/* background: #ffe800; *//* border-radius: 5px; *//* padding: 0 10px !important; */}
	.utill:before{ display:none;}
	#wrap,
	#header .headerWrap,
	#container,
	#footer .footerBox {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box}
	#container {/* padding-top: 60px; */}
	#header .headerWrap, #footer .footerBox{width:100%;/* min-width:320px; */margin:0 auto;}
	
	#wrap{width:100%; min-width:300px; margin:0 auto; background:#fff;}
	#header {position:absolute;padding-top:0;top: 0;min-width:300px;height:auto;}
	#header .headerWrap{height: auto;width: 92%;}		
	#header .temp { height:auto;}
	
	/* logo */
	.headerWrap .logo {top: 10px;left: 0;width: 170px;height: 60px;}
	.headerWrap .logo a{-webkit-background-size: contain;height: 100%;}
	
	/* mGnb */
	.btn_menu{position: absolute;right: 0;top: 27px; }
	#mGnb {display: block;z-index: 999;overflow:hidden;/* padding: 10px; */font-size:0;width: 20px;height: 20px;position: relative;}		
	#mGnb.mGnbOn{transform: rotate(180deg);cursor: pointer;transition: .2s cubic-bezier(.8, .5, .2, 1.4);position: fixed;right: 20px;top: 25px;width: 30px;height: 30px;}
	#mGnb.mGnbOn .nav-btn{}
	#mGnb.mGnbOn .nav-btn .line{background-color:#000;width:100%;position:absolute;top:50%;left: 0; height: 2px;}
	#mGnb.mGnbOn .nav-btn .line:nth-child(1) {transform: rotate(45deg); }
	#mGnb.mGnbOn .nav-btn .line:nth-child(3) {transform: rotate(-45deg); }
	#mGnb.mGnbOn .nav-btn .line:nth-child(2){ display:none;}
	
	/* topBox */
	#header .topBox{overflow: hidden;padding: 1.8em 20px 2.5em 20px;position: relative;display:flex;flex-direction: column; }
	#header .topBox .home{width:100%; display:flex;}
	#header .topBox .home a{background: url('../images/common/home.svg') no-repeat 50% 50% / cover;width: 25px;height: 25px;}
	#header .topBox .logo{padding:0 !important;height: auto;width: 220px;margin: 0;position: relative;top:inherit;left: inherit;display: block;}
	#header .topBox .logo a{height: auto;width:auto;display: block;background-image: url(../images/common/ci.svg);}
	#header .topBox .logo a span{display: block;width: 100%;height: auto;}
	#header .topBox .logo a .tit{text-align:center;font-size: 1.35em;line-height: 1.3em;padding: 0 !important;}
	#header .topBox .logo a .tit{color: #222;line-height: 50px;}
				
	/* gnb menu */
	.gnb_wrap {position:fixed;right: -100%;top: 0px;width: 50%;min-width:400px;height: 100vh;z-index:200;display:block;background:#fff;}
	.gnb_wrap nav {position:relative;width:auto;height:100%;background: #fff;overflow:hidden;overflow-y:auto;z-index:3;}
	#gnb {position:static;float:none;width:100%;padding-left: 0 !important;text-align: center;padding-right: 0;display: block;padding-bottom: 200px;margin: 0;}/*메뉴위치*/
	#gnb:after {display:block; content:""; clear:both;}
	#gnb > li:first-child{border-top: 1px solid #ededed;}
	#gnb > li:last-child{display:block;}
	#gnb > li:hover, #gnb > li:focus{background-color:transparent;}
	#gnb > li {visibility:inherit;position:static;margin: 0 !important;padding:0;background:none;text-align:left;float:none;display: block;width:auto !important;border-bottom: 1px solid #ededed;border-right:none;}
	#gnb > li.pc_non{display: block;}
	
	#gnb > li .tit{position:relative;z-index: 2;display: block;height: auto;}
	#gnb > li .tit > a{display:block;color: #111;font-size: 1.25em;height: 2.8em;line-height: 2.8em;letter-spacing: -0.05em;padding: 0px 0 0px 25px;border:none;width: 100%;position:relative;font-weight: 500;}
	#gnb > li .tit > a:after{content:'';display:block;width: 10px !important;height: 10px !important;border: 2px solid #b2b2b2;border-width: 2px 2px 0 0;position:absolute;left: inherit;right: 25px;top:50%;margin: -7px 0 0 0;background: none;border-radius: 0;transform: rotate(45deg) !important;opacity: 1;transition: all .3s ease-in-out;}
	#gnb > li.arrow .tit > a:after{transform: rotate(135deg)!important;}
	#gnb > li.on .tit a,
	#gnb > li .tit > a:hover, 
	#gnb > li .tit > a:focus,
	#gnb > li .tit > a:active,
	#gnb > li:hover .tit a{color: var(--mainColor) !important;background: transparent;}
	#gnb > li .tit > a:hover:after,
	#gnb > li .tit > a:focus:after,
	#gnb > li .tit > a:active:after,
	#gnb > li.on .tit > a:after,
	#gnb > li:hover .tit a:after{border-color: var(--mainColor);opacity: 1;}	

	#gnb > li .tit > a:after{}

	#gnb > li > .ulWrap{ opacity:1;}
	#gnb > li .ulWrap:before, #gnb > li > .ulWrap:after{display:none;}
	#gnb > li > div {left: inherit !important;top: inherit !important;min-width: inherit;margin:0;padding: 0px 0;border:0;background-color: #f8f8f8;box-shadow:none;visibility: visible;position: relative !important;height: 100%;width: 100% !important;opacity: 1;}
	#gnb > li > div > ul > li {margin:0;width:auto;float: none !important;}
	#gnb > li > div > ul > li:before{ display:none;}	
	#gnb .depth2{border-left:none;height:auto;padding: 0 !important;width:100%;float:none !important;display:block;margin-left: 0 !important;margin-right: 0 !important;border-top: 1px solid #e3e3e3;background: none;border-right: none !important;opacity: 1;border-radius: 0;transform: none !important;position: relative;left: inherit;top: inherit;min-width: inherit;}
	#gnb .depth2{transform: translateY(0px);}
	#gnb .depth2 li:first-child:after,
	#gnb .depth2 li:first-child:before{ display:none;}	
	#gnb > li > div > ul > li > a {display:block;margin:0;border-top: 1px solid #e3e3e3;padding: 0.88em 25px;line-height: 1.25em;background-position: left 25px center;font-size: 1.125em;text-align: left;color: #444;}	
	#gnb > li > div > ul > li > a:hover,
	#gnb > li > div > ul > li > a:focus,
	#gnb > li > div > ul > li > a:active,
	#gnb > li > div > ul > li.on > a{ text-decoration:underline;color: var(--mainColor) !important;}		
	#gnb > li > div > ul > li:first-child > a{border-top:0}
	#gnb > li > .ulWrap > ul > li > a:before{ display:none;}	

	/* mobileblock */	
	#mobileblock{position:fixed; z-index:50; top:0px; left:0; width:100%; height:100%; background: rgba(0,0,0,0.6); display:none;}
	
	/* footer */	
	#footer {font-size: 1.3rem;}
	#footer .innerWrap{flex-wrap: wrap;padding: 5rem 0 3rem;}
	#footer .pc-ver{display:none;}
	#footer .mobile-ver{display:block;margin-top: 2.5rem;}
	.footer_top{display:block; }
	.footer_bottom{flex-direction: column-reverse;}
	#footer .con.left{/* width:auto; */}
	#footer .con.right{margin: 1rem 0 0 0;width: 100%; align-items: flex-start;}
	#footer .logo{height: 4.5rem;}
	#footer .footer_bottom .con.right{max-width:inherit;margin-top: 0;}
	.foot_fam{margin: 0 0 2rem 0;max-width: 500px;}
	.foot_fam img{/* height:25px; */}
	.copyright{margin-top: 2.85rem;border-top: 1px solid rgba(255,255,255,0.1);padding-top: 1.85rem;}

	
	.family_site{width:50%;}
	.foot_util{ gap: 15px;}
	.foot_util li a{font-size:1.4rem;letter-spacing:-0.05em;}
	.foot_util li a.ico_link:after{ width:10px; height:10px;}
	
	.btn-top{box-shadow: 0px 2px 8px rgba(0,0,0,0.15);width: 40px;height: 40px;right: 15px;} 
	.btn-top.on{bottom: 15px;right: 15px;}	
	.btn-top span{ background-size: 15px;}
	.btn-top span:before{background-size:10px;} 
	
}
@media only screen and (max-width: 768px) {	
	body{ font-size:13px;}
	#container {/* padding-top: 50px; */}
	
	/* utill */
	.utill{min-width: auto;background:none;}
	.utill li.kakao a:before{ background-size:25px;}



	/* logo */
	.headerWrap .logo {width: 165px;height: 50px;}

	/* mGnb */
	#mGnb{/* width:50px; *//* height:50px; */}
	#mGnb span{right:15px; width:25px;}
	#mGnb a{ height:50px; }
	#mGnb span:nth-child(1){top: 18px;}
	#mGnb span:nth-child(2){top: 25px;}
	#mGnb span:nth-child(3){top: 32px;}
	#mGnb.mGnbOn span{ top:24px; }

	.gnb_wrap{width:100%;min-width: inherit;}
	
	/* footer */		
	#footer{text-align:center;}
	#footer .innerWrap{padding: 3.5rem 0 2.5rem;}
	#footer .add_list dt, #footer .add_list dd{font-size:1.3rem;min-width: inherit;}
	
	#footer .logo{ height:35px;}
	#footer .con.left,
	#footer .con.right{align-items: center;margin:0}
	#footer .addInfo{align-items: center;flex-direction: column;width: 100%;gap: 3px;}
	.foot_util{margin-top:0.5rem;gap: 10px;}
	.foot_util li a{font-size:1.3rem;}
	#footer .foot_fam {margin: 0 0 1.5rem 0;padding: 0 2%;gap: 5%;}
	#footer .add_list{width: auto !important;}
	#footer .footer_bottom .innerWrap{flex-direction: column-reverse;gap: 0;}
	.footer_bottom ul{justify-content: center; }
	.footer_bottom li a{font-size: 1.3rem;}
	.footer_bottom p{font-size: 1rem;}
	.copyright{font-size:1.3rem}
}
@media only screen and (max-width:480px) {
	.headerWrap .logo{width:150px}
	.utill li.tel{display:none;}
	#footer{text-align:left;}
	#footer .addInfo,#footer .con.left, #footer .con.right{align-items:flex-start;}

}



/*
================================================================================
SUB LAYOUT
================================================================================
*/
/* visual_area */
.visual_area{position: relative;height: 500px;overflow: hidden;display: block;background: #142a3d url('../images/sub/sub_visual_01.jpg') 50% 20% no-repeat;background-size: cover !important;}
.visual_area .txtBox{height: 100%;align-items: center;justify-content: center;flex-direction: column;display: flex;text-align: center;margin: 0 auto;color:#fff;padding-top: 8rem;}
.visual_area .txtBox p{color:#fff;font-size: 2.15rem;line-height: 1.4em;display: inline-block;position: relative;font-weight: 100;} 
.visual_area .txtBox .tit{display: block;font-size: 7rem;line-height: 1em;margin-bottom: 15px;font-weight: 700;}
.visual_area .txtBox .desc{ opacity:0.8}
/*.visual_area.top_img01 { background: url('../images/sub/sub_visual_01.jpg') 50% 0% no-repeat;}
.visual_area.top_img02 { background: url('../images/sub/sub_visual_02.jpg') 50% 0% no-repeat;}
.visual_area.top_img03 { background: url('../images/sub/sub_visual_03.jpg') 50% 0% no-repeat;}
.visual_area.top_img04 { background: url('../images/sub/sub_visual_04.jpg') 50% 0% no-repeat;}
.visual_area.top_img05 { background: url('../images/sub/sub_visual_05.jpg') 50% 0% no-repeat;}
.visual_area.top_img06 {background: url('../images/sub/sub_visual_etc.jpg') 50% 0% no-repeat;}
.visual_area.top_img02 .txtBox p{ color:#444;}*/

/* title_area */	
.title_area{overflow: hidden;margin: 13rem auto 50px;display: none;}
.title_area h2{font-size: 2.4em;line-height:1.4em;font-weight: 500;color: #383737;text-align: center;/* float: left; */}
.title_area .location {text-align:left; float: right;margin-top: 10px;}
.title_area .location span {display:inline-block; padding:0 8px 0 15px; background:url('../images/common/icon_location_arrow.gif') no-repeat 0px center; font-size:0.93em; color:#8b8b8b;}
.title_area .location a:last-child span {color:#111; font-weight: 500;}
.title_area .location a.home{ margin-right: 10px;}
.title_area .location a.home img {vertical-align:middle; margin-top:-3px;}
@media only screen and (max-width:1500px){	
	.visual_area{height: 430px;}
	.visual_area .txtBox .tit{font-size: 6rem;}
	.visual_area .txtBox p{font-size:2rem}
}
@media only screen and (max-width:1024px){	
	.visual_area{height: 320px;}
	.visual_area .txtBox{padding: 4rem 0 0 0;}
	.visual_area .txtBox p{/* margin-top: 30px; */font-size: 1em;}
	.visual_area .txtBox .tit{font-size: 5rem;}

} 
@media only screen and (max-width: 768px){	
	.visual_area{height: 230px; }	
	.visual_area .txtBox .tit{font-size:3.5rem}
}


@media only screen and (max-width:480px) {
	.visual_area{/* height: 110px; */}
	.visual_area .txtBox p{ margin-top: 20px; }	
	.visual_area .txtBox p strong{ font-size:2em; margin-bottom: 8px;}
}


/* topnavWrap */
.topnavWrap{position: relative; width: 100%;padding-top: 60px;z-index: 10;}
.topnavWrap .inner {border-bottom: 1px solid rgba(0, 0, 0, .1);padding:0}
.topnavWrap .swiper {width: 100%;}
.topnavWrap .swiper-wrapper {justify-content: flex-start;flex-wrap: nowrap;}
.topnavWrap .swiper-slide {width: auto;flex: 1; min-width: 80px;}
.topnavWrap .swiper-slide a{display: block;height: 100%;position:relative;text-align: center;line-height: 60px;color: #222;font-weight: 700;font-size: 1.7rem;}
.topnavWrap .swiper-slide.on a {  color: #111;}
.topnavWrap .swiper-slide.on a:after{content: "";display: block;position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);width: 100%;height: 2px;background: #222;}
.topnavWrap .swiper-slide.on a:hover, .topnavWrap .swiper-slide.on a:focus{text-decoration:none;} 
.fixedMenu.topnavWrap{position: fixed;top: 80px;background: #fdfaf7;box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.25);transition: .25s;padding-top: 0;}

@media only screen and (max-width: 1080px){	
	.topnavWrap{padding-top:0px;}
	.topnavWrap .swiper-slide a{line-height:45px;font-size:1.5rem}
	.fixedMenu.topnavWrap{top:0;}	
}
@media only screen and (max-width: 480px){
	.topnavWrap .inner{ height: 100%; display: flex; align-items: center; justify-content: space-between; position: relative;}
	.topnavWrap .swiper-slide{cursor: pointer;display: flex;align-items: center;min-width: inherit;flex: none;}
	.topnavWrap .swiper-slide a{padding: 0 15px;display: flex;flex-direction: column;align-items: center;justify-content: center;}
}




/* content */
.sub_content_wrap {position:relative;width: 1250px;overflow: hidden;margin:0 auto;}
#sub_content{position:relative;overflow: hidden; }
#sub_content:after{ content:''; display:block; position:absolute; left:-1px; top:0; width:1px; height:100%; background:#dbdbdb;  z-index: 1}
#page{clear:both;min-height:500px;width: 1320px;margin: 0 auto;padding: 13rem 0;}
.sub_content_wrap p{ margin-bottom:15px;}
.sub_content_wrap li p{ margin-bottom:5px;}
#page.noWrap {width:100%;padding-bottom: 0px}
#page table p{ margin-bottom:0;}

.sub_content_wrap.wildBox #menu{ display:none;}
.sub_content_wrap.wildBox #sub_content{ width:100%;}
.ttl01{clear: both; font-size:1.47em;color:#333; margin:50px 0 15px; position:relative;}
.ttl01:before{content:'';display:block;position:absolute;top:-8px;left:0;background: var(--mainColor);width:45px;height:3px;}
.ttl02{clear: both;font-size:1.2em;color: var(--mainColor);margin:40px 0 10px;position: relative;}
.ttl01 span,
.ttl02 span,
.ttl03 span{ display: inline-block; color: #444; font-size: .85em; font-weight: 400;}
.ttl03{clear: both;font-size:1.15em; ;color:#222;margin:20px 0 8px; position: relative;padding-left: 15px;}
.ttl03:before{content:'';display: block;position: absolute;left: 0px;top: 6px;width: 5px;height: 5px;border-radius: 50%;border: 3px solid var(--mainColor);}
.ttl04{clear: both;font-size:1.1em; ;color:#555;margin:20px 0 5px; position: relative;padding-left: 15px;}
.ttl04:before{content:'';display: block;position: absolute;left: 4px;top: 8px;background:#5d5d5d;width: 3px;height: 3px;}
.ttl01 + .ttl02 { margin-top: 25px}
.ttl02 + .ttl03 { margin-top: 0}


@media only screen and (max-width:1024px) {	
	/* content */	
	.sub_content_wrap { width: 100%; margin: 0 auto;}
	#sub_content {}
	#sub_content:after{ display:none;}
		
	.cont-ctrl-btns{display:none;}	
	#sub_content p{ margin-bottom:10px;}	
	
	/* title */
	.title_area h2{font-size: 2.4em;}	
	.title_area{position:relative;margin: 9rem auto 40px;}	
	.title_area .location span, .title_area .location strong { padding-left:12px; background:url('../images/common/icon_location_arrow.gif') no-repeat 3px center; font-size: 12px }
	.title_area .location strong { font-weight:normal;color:#777}
	.title_area .location a.home img {vertical-align:middle; margin-top:-1px}	
	.title_area .pageTitle{ font-size:1.6em; color:#111; margin:0 0 8px}

	#page {width: 100%;max-width: 96%;min-width: 320px;padding: 9rem 0;}
	#page.noWrap {max-width: 100%;padding: 0;}
	
	.ttl02:before{ top:7px;}
	.ttl02:after{ top:14px;}
}

@media only screen and (max-width: 768px) {	
	#sub_content{}
	#sub_content p{ margin-bottom:5px;}
	.title_area .location { display: none}
	#page{min-height:300px;max-width: 94%;padding: 6rem 0;}
	
	.title_area span{ margin-bottom:10px;}
	.title_area h2 {font-size: 2em;}
	.title_area{margin: 6rem auto 40px;max-width: 100%;}
	.ttl00{margin:35px 0 0;line-height:1.2em;font-size: 2em;}
	.ttl02:before, .ttl02:after{ width:4px; height: 4px;}
	.ttl02:before{ top:6px;}
	.ttl02:after{ top:13px;}
}

