@charset "utf-8";
/* layout.css는 전체적인 레이아웃 스타일을 정의합니다. */ 

#skipToContent a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skipToContent a:focus, 
#skipToContent a:active {width:200px;height:50px;background:#21272e;color:#fff;font-size:14px;font-weight:bold;text-align:center;text-decoration:none;line-height:50px}

.contain {max-width:1460px; margin:0 auto; padding-left:30px; padding-right:30px;}
.contain:after {content:""; display:block; clear:both;}

.only-desktop-tablet {display:block;}
.only-mobile {display:none;}

/* header */

#header {position:relative; top:0; left:0; width:100%; z-index:100; height:100px; background:#fff;}  
#header .contain {position:relative; max-width:1780px !important; height:100px;}
#header .sitelogo {position:absolute; top:50%; left:30px; margin-top:-23.5px; z-index:10;}
#header .sitelogo a {display:block; width:232px; height:47px; overflow:hidden; text-indent:-9999em; background:url("../images/common/logo.png") 50% 50% no-repeat; background-size:contain;}

.header-logo {position:absolute; top:50%; margin-top:-40px; right:30px;}
.header-logo ul {width:100%; max-width:150px; display:flex; flex-wrap:wrap; margin:0 -5px; margin-bottom:-10px;}
.header-logo ul li {width:33.3333%; padding:0 5px; margin-bottom:10px;}
.header-logo ul li a {}


#sub .select-input .img {width:24px; height:24px; background:url("../images/main/language_w.png")50% 50% no-repeat; background-size:contain;}

#gnb > ul {display:flex; justify-content:center; margin-left:100px;}
#gnb > ul > li {position:relative;}
#gnb > ul > li > a {position:relative; display:inline-block; color:#333; font-weight:600; font-size:20px; line-height:100px; letter-spacing:-.03em; padding:0 65px; text-align:center;} 
#gnb > ul > li:hover > a {color:#023c8b;}

#gnb .submenu {height:0; overflow:hidden; position:absolute; right:0; width:100%; text-align:center; z-index:15;}
#gnb .submenu > ul {position:relative; padding:15px 0;}
#gnb .submenu > ul > li {font-size:16px; line-height:26px;}
#gnb .submenu > ul > li > a {position:relative; display:inline-block; text-decoration:none; font-size:18px; font-weight:400; padding-bottom:20px; color:#fff;}
#gnb .submenu > ul > li:first-child > a {margin-top:15px;}
#gnb .submenu > ul > li:hover > a {text-decoration:underline;}

.submenu-txt {display:none; position:absolute;  padding:5px;left:350px; top:125px; z-index:2; color:#fff; font-size:20px; font-weight:bold;}
.submenu-txt a { font-family:'NanumSquare', sans-serif; position:relative; display:inline-block; }
.submenu-txt a span {position:relative; display:block; width:100%; height:0; padding-bottom:100%; overflow:hidden;}

.submenu-bg {position:relative; display:none; position:absolute; top:100px; left:0; width:100%; background-color:#354197; overflow:hidden;}

.language {position:absolute; right:30px; top:50%; margin-top:-20px; z-index:50;}
.language ul {display:flex;}
.language ul li {position:relative; width:110px; border:1px solid #ddd; border-radius:20px; padding:0 12px; height:40px; line-height:38px;} 
.language ul li a {position:relative; display:block; text-align:center; font-family:'Montserrat', sans-serif; color:#333; font-size:18px; font-weight:600;}
.language ul li a {display:flex; justify-content:center; align-items:center;}
.language ul li a span img {margin-right:7px; vertical-align:text-top; margin-top:2px;}
.language ul li.active a {color:#333;}
.language ul li.active a:before {position:absolute; content:""; width:26px; height:3px; background:#083e88; bottom:0; left:50%; margin-left:-13px;}

.search-wrap {position:absolute; top:50%; margin-top:-20px; right:700px;}
.search-wrap .input {width:280px; height:40px; border-radius:30px; background:#fff; border:1px solid #ddd; font-size:14px; color:#454545;}
.search-wrap .btn-pack.medium {height:auto; line-height:100%; padding:0; font-size:14px;}
.search-wrap .btn-pack.dark {background:transparent; border:0; height:35px; line-height:0; margin-left:-30px;}
 
.shows {display:block} /*보여주기*/
.hides {display:none} /*숨기기*/
#layer {display:none;}

 /* main */ 
.main-visual {position:relative; width:100%; line-height:0; overflow:hidden; z-index:1;}
.main-visual:before {content:""; position:absolute; top:0; left:0; width:100%; height:200px; background-image:linear-gradient(#000, transparent); opacity:.6; z-index:40;}
.main-visual .item {position:relative; width:100%; z-index:1;}
.main-visual .img {display:block; position:relative; height:880px; background-repeat:no-repeat; background-position:center center; -webkit-background-size:cover; background-size:cover; overflow:hidden;}
.main-visual .txt {font-family:'Montserrat', sans-serif; font-size:20px; font-weight:500; letter-spacing:-.03em; line-height:1.700em; margin-bottom:5px;}
.main-visual .caption {position:absolute; top:50%; left: 0; width: 100%; padding: 0 30px; text-align: center; z-index: 45; transform: translateY(-45%); color: #fff;}
.main-visual .caption.height {top:230px;}
.main-visual .caption.height .con-wrap {text-align:left;}
.main-visual .caption.height .con-wrap h3 {font-family: 'Cafe24Ssurround'; font-size:55px; color:#433579; letter-spacing:-.05em; line-height:1.3em; text-shadow:8px 0 10px rgb(255 255 255 / 80%); margin-bottom:10px;}
.main-visual .caption h2 {font-size:54px; font-weight:600; color:#fff; letter-spacing:-.03em; line-height:1.3em;}
.main-visual .caption h2 p {color:#fff; padding:20px 0;}
.main-visual .con-wrap {width:100%; max-width:1360px; margin:0 auto; padding:0 30px;}
.main-visual .slick-arrow {position:absolute; top:50%; margin-top:-28.5px; z-index:50; width:30px; height:57px; background-color:transparent; background-position:50% 50%; background-repeat:no-repeat; border:0; overflow:hidden; text-indent:-9999em; transition:.2s; background-size:contain;}
.main-visual .slick-prev {left:60px; background-image:url("../images/main/slide_prev.png");} 
.main-visual .slick-next {right:60px; background-image:url("../images/main/slide_next.png");} 

.visual-scroll {position:absolute; left:50%; animation:pulse 2s infinite; bottom:65px; color:#fff; font-size:16px; letter-spacing:0.2em; z-index:5; margin-left:-25px; bottom:0;}

.scroll {
	position:absolute; 
	bottom:60px; 
	left:50%; 
	margin-left:-52.5px; 
	width:105px; 
	height:46px;
	text-align:center;
	background:url('/images/main/scroll_down.png') 50% 100% no-repeat;
	background-size:contain;
	z-index:10;
	-webkit-animation: bounce2 .9s linear infinite alternate;
    -moz-animation: bounce2 .9s linear infinite alternate;
    -o-animation: bounce2 .9s linear infinite alternate;
    -ms-animation: bounce2 .9s linear infinite alternate;
    animation: bounce2 .9s linear infinite alternate;
	 
}
@-moz-keyframes bounce2{from{bottom:80px;}to{bottom:90px;}}
@-webkit-keyframes bounce2{from{bottom:80px;}to{bottom:90px;}}
@-o-keyframes bounce2{from{bottom:80px;}to{bottom:90px;}}
@keyframes bounce2{from{bottom:80px;}to{bottom:90px;}}


/* for mobile */
.btn-m-menu {position:absolute; top:50%; right:30px; margin-top:-12px; width:27px; height:24px; text-indent:-9999em; z-index:50; display:none;}
.btn-m-menu span {position:absolute; left:0; right:0; top:11px; height:2px; background:#000;}
.btn-m-menu span:before,
.btn-m-menu span:after {content:" "; position:absolute; left:-5px; right:0; height:2px; background:#000;}
.btn-m-menu span:before {top:-9px;}
.btn-m-menu span:after {bottom:-9px;}

.mobile-navigation {display:block; position:fixed; top:0; right:0; width:280px; height:100%; overflow:auto; transition:.2s linear; -ms-transform:translateX(100%); transform:translateX(100%); background:#fff; z-index:102;}
.mobile-navigation .home {padding:8px 20px;}
.mobile-navigation .home a {display:block;}
.mobile-navigation .home img {height:auto;}
.mobile-navigation .nav-menu>ul {border-top:0;}
.mobile-navigation .nav-menu>ul>li {border-bottom:1px solid #dfdfdf;}
.mobile-navigation .nav-menu>ul>li>a {position:relative; padding:13px 20px; display:block; color:#242424; font-size:16px; font-weight:700; line-height:1.5em;}
.mobile-navigation .nav-menu>ul>li>a:after {content:""; position:absolute; top:50%; right:20px; transform:translateY(-75%) rotate(45deg); width:12px; height:12px; border-right:2px solid #242424; border-bottom:2px solid #242424;}
.mobile-navigation .nav-menu>ul>li.active>a {color:#164755;}
.mobile-navigation .nav-menu>ul>li.active>a:after {transform:translateY(-35%) rotate(-135deg);}
.mobile-navigation .nav-menu .submenu {display:none; padding:10px 20px; background:#fff; color:#000; font-size:16px; line-height:1.5em;}
.mobile-navigation .nav-menu .submenu > ul >  li > a {display:block; padding:6px 0;}
.mobile-navigation .close {position:absolute; top:16px; right:10px; width:24px; height:24px; text-indent:-9999em; overflow:hidden;}
.mobile-navigation .close:before,
.mobile-navigation .close:after {content:" "; position:absolute; top:11px; left:0; width:100%; height:2px; background:#fff; border-radius:3px;}
.mobile-navigation .close:before {transform:rotate(45deg);}
.mobile-navigation .close:after {transform:rotate(-45deg);}
.mobile-overlay {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.6; z-index:101;}

html.menu-opened {overflow:hidden;}
html.menu-opened .mobile-navigation {-ms-transform:translateX(0); transform:translateX(0);}
html.menu-opened .mobile-overlay {display:block;}


.main-tit {margin-bottom:35px;}
.main-tit h4 {font-family:'Montserrat', sans-serif; font-size:50px; font-weight:700; letter-spacing:0; color:#333; line-height:1.3em;} 

/* main-about */
.main-about {display:flex; padding:100px 0;}
.main-about .txt-box {width:50%;}
.main-about .txt-box .s-tt {font-family:'Montserrat', sans-serif; font-size:20px; font-weight:600; color:#333; letter-spacing:0; line-height:1.3em;}
.main-about .txt-box h3 {font-family:'Montserrat', sans-serif; font-size:40px; font-weight:700; color:#333; letter-spacing:0; line-height:1.250em; margin:30px 0 50px;}
.main-about .txt-box .txt {font-size:18px; color:#454545; letter-spacing:-.03em; line-height:1.556em;}
.main-about .txt-box .more-btn {font-size:18px; font-family:'Montserrat', sans-serif; color:#333; font-weight:600; margin-top:100px;}
.main-about .txt-box .more-btn span img {vertical-align:middle; margin-left:10px;}
.main-about .img {width:50%;}

/* Main-business */

.main-product {padding:100px 0; background:#f8f8f8;}

.mainbusiness-wrap {display:flex; justify-content:center; transition:all 2s ease-out 0s; margin:0 -10px;}
.mainbusiness-wrap a {/* width:20%;  */ transition:.2s ease-out; display:block;}
.mainbusiness-wrap .mainbusiness-list {transition:.2s ease-out; position:relative; padding:0 10px;}
.mainbusiness-wrap .mainbusiness-list .img {transition:.2s ease-out;}
.mainbusiness-wrap .mainbusiness-list .img img {transition:.2s ease-out; width:216px; height:500px;}
.mainbusiness-wrap .mainbusiness-list .caption {transition:.2s ease-out; position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; color:#fff; text-align:center; z-index:40;}
.mainbusiness-wrap .mainbusiness-list .caption h4 {transition:.2s ease-out; color:#fff; font-size:24px; font-weight:700; line-height:1.250em; letter-spacing:-.03em;}
.mainbusiness-wrap .mainbusiness-list .hover-box {transition: all 2s; position:absolute; top:0; left:0; width:100%; height:100%; display:none;}
.mainbusiness-wrap .mainbusiness-list:hover .hover-box {transition: all 2s; display:block; z-index:99; background-position:50% 50%;}
.mainbusiness-wrap .mainbusiness-list:hover h4 {display:none;}
.mainbusiness-wrap .mainbusiness-list:hover {transition:.2s ease-out; width:690px; margin:0 10px;}
.mainbusiness-wrap .mainbusiness-list .hover-box h5 {transition:.2s ease-out; font-size:30px; font-weight:700; letter-spacing:-.03em; line-height:1.0em; color:#333; margin-bottom:15px;}
.mainbusiness-wrap .mainbusiness-list .hover-box .txt {transition:.2s ease-out; position:relative; font-size:16px; color:#454545; letter-spacing:-.03em; line-height:1.500em;}
.mainbusiness-wrap .mainbusiness-list .hover-box .txt:before {position:absolute; content:""; width:34px; height:2px; background:#fff; bottom:0; left:50%; margin-left:-17px; }
.mainbusiness-wrap .mainbusiness-list .hover-box ul {transition:.2s ease-out; display:inline-flex; flex-direction:column; text-align:left;}
.mainbusiness-wrap .mainbusiness-list .hover-box ul li {transition:.2s ease-out; text-align:left;}
.mainbusiness-wrap .mainbusiness-list .hover-box .btn {transition:.2s ease-out; position:absolute; right:-30px; top:-30px;}
.mainbusiness-wrap .mainbusiness-list .hover-box .btn span {font-size:20px; padding-left:20px;}
.mainbusiness-wrap .mainbusiness-list .hover-box .caption {top:auto; bottom:0; max-width:520px; transform:none; text-align:left;; background:#fff; max-height:150px; border-radius:0 0 0 15px; padding:25px 35px;}

/* main-notice */
.main-notice {padding:100px 0;}
.main-notice .main-tit.flex {display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:30px;}
.main-notice .main-tit.flex .more-btn {}
.main-notice .main-tit.flex .more-btn span img {vertical-align:middle; margin-left:7px;}
.main-notice .main-notice-list {} 
.main-notice .main-notice-list .slick-list {margin-left:-40px;}
.main-notice .main-notice-list .slick-slide {margin-left:40px;}
.main-notice .main-notice-list .slick-slide .item-wrap {}
.main-notice .main-notice-list .slick-slide .item-wrap .tit {font-size:18px; font-weight:600; color:#333; letter-spacing:-.03em; line-height:1.3em;}
.main-notice .main-notice-list .slick-slide .item-wrap .txt {margin-top:20px; overflow: hidden; text-overflow:ellipsis; word-break:break-all; white-space:normal; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical;}
.main-notice .main-notice-list .slick-slide .date {color:#999;}
.main-notice .main-notice-list .item {border-top:1px solid #242424; border-bottom:1px solid #ddd;}
.main-notice .main-notice-list .item a {min-height:245px; padding:25px 0; display:flex !important; flex-direction:column; justify-content:space-between;}
.main-notice .main-notice-list .slick-arrow {position:absolute; top:50%; margin-top:-22px; z-index:50; width:25px; height:44px; background-color:transparent; background-position:50% 50%; background-repeat:no-repeat; border:0; overflow:hidden; text-indent:-9999em; transition:.2s; background-size:contain;}
.main-notice .main-notice-list .slick-prev {left:-100px; background-image:url("../images/main/slide_prevs.png");} 
.main-notice .main-notice-list .slick-next {right:-100px; background-image:url("../images/main/slide_nexts.png");} 

.main-contact {position:relative; background:#454545; padding:100px 0;}
.main-contact:before {position:absolute; content:""; width:616px; height:218px; background:url('../images/main/con-tt.png')50% 50% no-repeat; background-size:contain; left:0; bottom:0;}
.main-contact .main-contact-list {display:flex;}
.main-contact .main-contact-list .main-contact-wrap {width:42.2%;}
.main-contact .main-contact-list .main-contact-wrap .main-tit {margin-bottom:70px;}
.main-contact .main-contact-list .main-contact-wrap .main-tit h4 {color:#fff;}
.main-contact .main-contact-list .main-contact-wrap dl {position:relative; padding-left:10px; padding-top:6px; color:#fff; margin-bottom:22px;}
.main-contact .main-contact-list .main-contact-wrap dl:before {position:absolute; content:""; width:6px; height:6px; background:#fff; border-radius:50%; top:0; left:0;}
.main-contact .main-contact-list .main-contact-wrap dl dt {font-size:18px; font-weight:700; letter-spacing:0; line-height:1.556em;}
.main-contact .main-contact-list .main-contact-wrap dl dd {font-size:18px; line-height:1.556em; letter-spacing:0;}
.main-contact .main-contact-list .board-form-wrap {width:58%;}
.main-contact .main-contact-list .board-form-wrap .board-forms {margin-left:-20px;}
.main-contact .main-contact-list .board-form-wrap .board-forms label {display:inline-block; margin-bottom:5px;}
.main-contact .main-contact-list .board-form-wrap .board-forms td {font-size:18px; font-weight:700;	color:#ddd; letter-spacing:0; line-height:1.556em; padding:0 20px 20px;}
.main-contact .main-contact-list .board-form-wrap .board-forms .input {min-width:385px; border-radius:7px;}
.main-contact .main-contact-list .board-form-wrap .form-agree {margin-top:0; margin-bottom:35px;}
.main-contact .main-contact-list .board-form-wrap .form-agree h3 {font-size:18px; font-weight:700; color:#ddd; letter-spacing:-.025em; line-height:;}
.main-contact .main-contact-list .board-form-wrap .form-agree .checkbox label {color:#ddd;}
.main-contact .main-contact-list .board-form-wrap .form-agree .scroll-box {border-radius:7px}
.main-contact .main-contact-list .board-form-wrap .btn-pack.large {border-radius:7px;}


/* for mobile */
.btn-m-menu {position:absolute; top:50%; right:15px; margin-top:-15px; width:30px; height:30px; text-align:center; text-indent:-9999em; z-index:50; display:none;}
.btn-m-menu span {position:absolute; right:0; top:50%; width:100%; margin-top:-1.5px; height:3px; background:#2c2c2c;}
.btn-m-menu span:before,
.btn-m-menu span:after {content:""; position:absolute; left:0;  width:100%; height:3px; background:#2c2c2c;}
.btn-m-menu span:before {top:-10px;}
z
.btn-m-menu span:after {bottom:-10px;}

.mobile-navigation {position:fixed; top:0; right:0; width:300px; bottom:0; transition:.2s ease-out; -ms-transform:translateX(100%); transform:translateX(100%); background:#fff; z-index:102;}
.mobile-navigation .inner {position:absolute; top:0; left:0; width:100%; height:100%; overflow:auto;}
.mobile-navigation .brand-image {border-bottom:1px solid #d6dfd1; background-color:#e9ede7; height:128px;}
.mobile-navigation .brand-image a {display:block; padding-top:40px; padding-left:40px;}
.mobile-navigation .nav-menu .depth3 {display:block; margin-left:23px; padding-bottom:18px;}
.mobile-navigation .nav-menu .depth3 ul li a {display:block; padding:4px 0; color:#fff; font-size:18px; font-weight:300; line-height:1.4em; letter-spacing:-.04em;}
.mobile-navigation .close {position:absolute; top:18px; right:22px; width:26px; height:26px; text-indent:-9999em; overflow:hidden;} 
.mobile-navigation .close:before, 
.mobile-navigation .close:after {content:" "; position:absolute; top:12px; left:0; width:100%; height:3px; background:#2c2c2c; border-radius:3px;} 
.mobile-navigation .close:before {transform:rotate(45deg);} 
.mobile-navigation .close:after {transform:rotate(-45deg);} 
.mobile-overlay {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.8; z-index:101;}

html.menu-opened {overflow:hidden;}
html.menu-opened .mobile-navigation {-ms-transform:translateX(0); transform:translateX(0);}
html.menu-opened .mobile-navigation .close {display:block;}
html.menu-opened .mobile-overlay {display:block;}

nav.nav-menu {position:relative; border-top:1px solid #ddd;}
.mobile-navigation .nav-menu>ul>li {border-bottom:1px solid #dfdfdf;}
.mobile-navigation .nav-menu>ul>li>a {position:relative; padding:10px 18px; display:block; color:#333; font-size:17px; font-weight:500; line-height:1.3em;}
.mobile-navigation .nav-menu>ul>li.active {background:#f4f4f4}
.mobile-navigation .nav-menu>ul>li.active>a {color:#fff; background:#023c8b;}
.mobile-navigation .nav-menu>ul>li.active>a:after {transform:translateY(-35%) rotate(-135deg); border-color:#fff}
.mobile-navigation .nav-menu>ul>li.home>a {padding:19px 18px;}
.mobile-navigation .nav-menu>ul>li.home>a:after {display:none;}
.mobile-navigation .nav-menu .submenu {display:none; margin:-1px 0 0 0; padding:10px 0;}
.mobile-navigation .nav-menu .submenu>ul>li>a {display:block; padding:5px 18px; color:#454545; font-size:15px; font-weight:400; line-height:1.4em;}
.mobile-navigation .nav-menu .submenu>ul>li>a:hover {color:#000;}
.mobile-navigation .nav-menu>ul>li>a:after {content:""; position:absolute; top:50%; right:20px; transform:translateY(-75%) rotate(45deg); width:12px; height:12px; border-right:2px solid #242424; border-bottom:2px solid #242424;}
.mobile-navigation img {width:20%; margin:10px;}
.mobile-navigation .close {position:absolute; top:10px; right:10px; width:24px; height:24px; text-indent:-9999em; overflow:hidden;}
.mobile-navigation .close:before,
.mobile-navigation .close:after {content:" "; position:absolute; top:11px; left:0; width:100%; height:2px; background:#242424; border-radius:3px;}
.mobile-navigation .close:before {transform:rotate(45deg);}
.mobile-navigation .close:after {transform:rotate(-45deg);}
.mobile-navigation img {width:50%; margin:10px;}


/* sub page */
#sub #rightMenu {display:none;}
.sub-visual {position:relative; width:100%; height:350px; overflow:hidden;}
.sub-visual .content {position:absolute; top:50%; left:0; text-align:center; transform:translateY(-50%); width:100%; color:#fff; z-index:20}
.sub-visual .tit {font-size:40px; line-height:1.3em; font-weight:700; letter-spacing:-.40px; margin-bottom:60px;}
.sub-visual p {font-size:18px; line-height:1.3em; font-weight:500; letter-spacing:-.40px;}
.sub-visual .background {
	position:absolute; 
	top:0; 
	left:0;
	width:100%; height:100%;	
	background-position:50% 50%;
	background-repeat:no-repeat;
	background-size:cover;
	transform:scale(1.09);
    -ms-transform:scale(1.09); /* IE 9 */
    -moz-transform:scale(1.09); /* Firefox */
    -webkit-transform:scale(1.09); /* Safari and Chrome */
    -o-transform:scale(1.09); /* Opera */
	transition: all 2s ease-out 0s;
	transition-delay: 0.1s;
	opacity: 0;
	z-index:0;
}
.sub-visual.load .background {
	transform:scale(1);
    -ms-transform:scale(1); /* IE 9 */
    -moz-transform:scale(1); /* Firefox */
    -webkit-transform:scale(1); /* Safari and Chrome */
    -o-transform:scale(1); /* Opera */
	opacity: 1;
}
/* sub */
.sub-visual {display:flex; align-items:center; height:400px; text-align:center; color:#fff; background-repeat:no-repeat; background-position:50% 50%; background-size:cover; overflow:hidden; text-align:center;}
.sub-visual .inner {width:100%;}
.sub-visual .inner .visual-wrap {width:100%; max-width:1260px; padding-left:30px; padding-right:30px; margin:0 auto; text-align:center;}
.sub-visual.none-lnb .inner {padding-bottom:0;}
.sub-visual h2 {font-size:46px; letter-spacing:-.03em; line-height:1.3em; font-weight:600;} 
.sub-visual p {font-family: 'Noto Serif KR', serif; font-size:18px; font-weight:500; letter-spacing:-.03em; line-height:1.667em;}
.sub-visual.bg1 {background-image:url("../images/common/sv1.jpg");}
.sub-visual.bg2 {background-image:url("../images/common/sv2.jpg");} 
.sub-visual.bg3 {background-image:url("../images/common/sv3.jpg");}
.sub-visual.bg3_2 {background-image:url("../images/common/sv3_2.jpg");}
.sub-visual.bg3_3 {background-image:url("../images/common/sv3_3.jpg");}
.sub-visual.bg3_4 {background-image:url("../images/common/sv3_4.jpg");}
.sub-visual.bg4 {background-image:url("../images/common/sv4.jpg");} 
.sub-visual.bg5 {background-image:url("../images/common/sv5.jpg");} 

/* lnb */

.tabmenu .contain {max-width:1360px;}
.lnb {position:relative; z-index:2; border-bottom:1px solid #ddd;}
.lnb.wrap ul {flex-wrap:wrap;}
.lnb.wrap ul li {width:20%; flex:auto;}
.lnb.wrap ul li:nth-child(n+6) {border-top:1px solid #ddd;}
.lnb.wrap ul li:nth-child(6) {border-left:1px solid #ddd;}
.lnb ul {display:flex; justify-content:center; max-width:1200px; margin:0 auto;}
.lnb ul li {flex:1; position:relative; font-size:18px; text-align:center; line-height:1.4em; letter-spacing:-.04em;}
.lnb ul li:first-child:after {display:none;}
.lnb ul li a {font-size:18px; letter-spacing:-.03em; border-right:1px solid #ddd; position:relative; display:flex; align-items:center; justify-content:center; height:60px; color:#333; font-weight:500;}
.lnb ul li:last-child a:before {display:none;}
.lnb ul li:first-child a {border-left:1px solid #ddd;}
.lnb ul li.active a {color:#fff; background:#354197;}   

#contArea {max-width:1260px; width:100%; padding-right:30px; padding-left:30px; margin:0 auto;}
#contArea.wide {max-width:none;} 


.sub-title {height:100px;}
.sub-title h2 {position:relative; font-size:30px; color:#242424; letter-spacing:-.03em; font-weight:600; line-height:1.3em; text-align:center; padding-bottom:25px}
 

.real-cont {padding-bottom:100px;}


/* footer */

.foot-wrap .name {font-size:17px; color:#454545; line-height:1.778em; font-weight:500; letter-spacing:-.03em; margin-bottom:5px;}
.foot-wrap ul {display:flex; margin:15px 0 30px;}
.foot-wrap ul li {color:#c3c3c3; letter-spacing:-.01em; margin-right:60px;}
.foot-wrap ul li:hover {text-decoration:underline;}

.go-top {position:fixed; right:50px; bottom:110px; z-index:99;}

.footer-links {}
.footer-links ul {display:flex; justify-content:flex-end;}
.footer-links ul li {font-size:15px; font-weight:500; color:#555; letter-spacing:-.03em; position:relative; padding-right:20px;}
.footer-links ul li:first-child {padding-left:0;}
.footer-links ul li:first-child:before {display:none;}

#footer {position:relative; line-height:28px; background:#fff; color:#666; border-top:1px solid #ddd; padding:30px 0;}
#footer .contain {max-width:1780px !important; display:flex; justify-content:space-between; position:relative; color:#cccbcb; font-size:15px; letter-spacing:-.03em; line-height:1.600em;}
#footer .footer-wrap {display:flex; align-items:center; width:100%; padding-bottom:30px; border-bottom:1px solid #ddd; margin-bottom:17px;}
#footer .footer-wrap .f-logo {}
#footer .footer-wrap .foot-wrap {}
#footer .footer-wrap .foot-wrap {padding-left:90px;}
#footer .footer-wrapper {}
#footer address {font-style:normal; font-weight:400; font-size:15px; line-height:1.6em; order:2;} 
#footer address span {color:#666; padding-right:25px;}
#footer address span a {font-size:14px; color:#777; padding-left:25px;}
#footer address span strong {color:#555; font-weight:600; display:inline-block; margin-bottom:10px;}
#footer address span.copy {font-size:15px; color:#686868; font-weight:400; display:inline-block; margin-top:30px;}
#footer address span.copy a {margin-left:10px; color:#9c9c9c;}

#footer .youtube {text-align:right; margin-top:25px;}

.toTops {display:block;}
.toTops img {vertical-align:middle;}

.foot-wrap {}
.account-wrap {order:2; display:flex; margin:0 -45px; margin-right:100px;}
.account-wrap .account {position:relative; padding:0 45px;}
.account-wrap .account:first-child:before {position:absolute; content:""; width:1px; height:120px; background:#ddd; top:50%; margin-top:-60px; right:0;}
.account-wrap .account .tit {font-size:17px; font-weight:500; color:#242424; letter-spacing:-.03em; line-height:1.471em;}
.account-wrap .account .bank {display:flex; font-size:25px; font-weight:700; color:#242424; letter-spacing:-.03em; line-height:1.3em; margin:5px 0; min-height:41px;}
.account-wrap .account .bank span img {vertical-align:middle; margin-right:5px;}
.account-wrap .account .lg-tit {font-size:32px; font-weight:700; color:#242424; letter-spacing:-.03em; line-height:1.3em; margin:5px 0 10px;}
.account-wrap .account .s-txt {color:#686868; letter-spacing:-.03em; line-height:1.563em;}
.account-wrap .account .s-txt span {display:block; margin-left:60px; margin-top:3px;}

.link-wrap {border-bottom:1px solid #666666;}
.foot-logo {position:absolute; top:50%; left:0; transform:translateY(-50%); z-index:5;}
.foot-info .foot-link {display:inline-block; font-weight:400;}
.foot-info {font-size:14px; color:#cccbcb;}
.foot-info div {width:1400px; border-bottom:1px solid #ccc; margin:0 auto;}
.foot-info .foot-link a {margin-right:20px; display:block; font-size:15px; color:#cccbcb;}
.foot-info span {position:relative;}
.foot-info .foot-after {color:#505050; padding-right:25px; font-size:16px; letter-spacing:-.03em; line-height:1.500em;}
.foot-link:after {content: ""; display:block; position:absolute; top:5px; left:125px; width:1px; height:12px; background-color:#a8a5a5; color:#e9e9e9;}

#footer .logo-txt {font-size:18px; color:#177a4c; font-weight:500; letter-spacing:-.03em; line-height:1.0em; margin-bottom:10px;}
#sub #footer .logo-txt {color:#2c2c2c;}
.logo-img {order:2; padding-right:140px;}

/* quick */ 

.main-link-wrap {position:fixed; top:650px; right:100px; z-index:99;}
.main-link-wrap ul li {margin-bottom:10px; clear:both;}
.main-link-wrap ul li a {float:right; display:flex; align-items:center; justify-content:center; width:60px; color:#fff; height:60px; border-radius:10px; background:#88c64e; margin-bottom:10px;}
.main-link-wrap ul li:last-child:hover a {width:60px;}
.main-link-wrap ul li a p {display:none;padding-left:10px;}
.main-link-wrap ul li a:hover p {display:block;}
.main-link-wrap ul li a:hover {width:150px;}