@charset "utf-8";


/* ===================================
	layout
 =================================== */
body.js-fixed {position: fixed; width: 100%;}
.wrap {position: relative; min-width: 320px; overflow: hidden;}
.inner {max-width: 1400px; margin: 0 auto;}

.side-util {position: fixed; top: 50%; right: 0; transform: translateY(-50%); z-index: 1;}
.side-util .util-item a {display: block; width: 65px; height: 100px; font-size: 0; background: #000 url('../images/main/blog.png') no-repeat center;}
.side-util .util-item:hover a {background-color: #2f6871;}
.side-util .facebook a {background: #3b5998 url('../images/main/facebook.png') no-repeat center;}
.side-util .youtube a {background: #c4302b url('../images/main/youtube.png') no-repeat center;}
.side-util .insta a {background: #833AB4  url('../images/main/insta.png') no-repeat center;}
.side-util .catalog a {background: #21ad93 url('../images/main/catalog.png') no-repeat center;}


@media only screen and (max-width: 1620px) {
	.side-util .util-item a {height: 100px;}
	.body-main .side-util {top: 100%; transform: translateY(-100%);}
}

@media only screen and (max-width: 1440px) {
	.inner {margin: 0 20px;}
}

@media only screen and (max-width: 1024px) {
	.side-util .util-item a {height: 80px; width: 50px; background-size: 50%;}
}

@media only screen and (max-width: 480px) {
}


.header-wrap {width: 100%; position: fixed; background: rgba(255, 255, 255, 0); border-bottom: 1px solid rgba(255, 255, 255, 0.1); z-index: 999; transition: all 0.3s ease-in-out;}
.header-wrap.js-fixed,
.header-wrap.js-open-d {background: rgba(255, 255, 255, 1); border-color: #f2f3f3;}

.header-inner {text-align: right; position: relative;}

.header-logo {position: absolute; top: 50%; left: 45px; transform: translateY(-50%); z-index: 1001;}
.header-logo a {display: block; font-size: 0; width: 158px; height: 42px; background: url('../images/common/header-logo.png') no-repeat center / contain;}
.header-logo a:hover,
.header-wrap.js-open-d .header-logo a {background: url('../images/common/footer-logo.png') no-repeat center / contain;}
.header-wrap.js-fixed .header-logo a {background: url('../images/common/footer-logo.png') no-repeat center / contain;}


.gnb {transition: all 0.3s ease-in-out; text-align: center; position: relative; z-index: 1000;}

.gnb-wrap {font-size: 0; flex-shrink: 0; width: auto; display: inline-flex; max-width: 1400px; position: relative;}
.gnb-1dep {display: inline-block; height: 100px; transition: all 0.3s ease-in-out; position: relative;}
.gnb-1dep > a {display: block; padding: 0 30px; font-size: 18px; font-weight: 700; color: #fff; text-align: center; text-transform: uppercase; transition: all 0.3s ease-in-out; position: relative;}
.gnb-1dep > a span {display: block; line-height: 100px;}
.gnb-1dep > a::after {display: block; content: ""; width: 0; height:6px; background: #21ad93; position: absolute; top: 0; left: 50%; transform: translateX(-50%); transition: all 0.3s ease-in-out;}

.gnb-1dep.js-open-d > a::after {width: 100%;}

.gnb-2dep {max-height: 0; min-width: 100%; margin-left: 5px; overflow: hidden; background: #fff; border-radius: 0 0 20px 0; position: absolute; top: 100px; left: 0; transition: all 0.5s ease-in-out; z-index: 1000; white-space: nowrap; text-align: left;}

.gnb-2dep > li > a {display: block; padding: 5px 25px 0; line-height: 30px; font-size: 17px; font-weight: 400; color:#868686; letter-spacing: -0.025em; transition: all 0.3s ease-in-out;}
.gnb-2dep > li:first-child > a {padding-top: 20px;}
.gnb-2dep > li:last-child > a {padding-bottom: 30px;}
.gnb-2dep > li > a:hover {color: #222; font-weight: 700;}
.gnb-2dep > li > a span {display: inline-block; line-height: 1.4; border-bottom: 1px solid rgba(237, 237, 237, 0);}
.gnb-2dep > li > a:hover span {border-color: #717171;}
.gnb-2dep > li > a em {font-size: 12px;}

.gnb-1dep.js-open-d .gnb-2dep {max-height: 500px; transition: all 0.3s ease-in-out; top: 100px;}
.header-wrap.js-fixed .gnb-1dep .gnb-2dep {top: 70px;}
.header-wrap.js-fixed .gnb-1dep.js-open-d .gnb-2dep {max-height: 500px;}

.gnb-inner-util {display: none;}
.gnb-inner-util .language {position: absolute; top: 50%; left: 20px; transform: translateY(-50%); z-index: 1;}
.header-wrap.js-open-d .gnb-inner-util .language .language-link,
.header-wrap.js-fixed .gnb-inner-util .language .language-link {color: #fff; background: url('../images/common/ico-lang02.png') no-repeat 0 50%;}
.header-wrap.js-open-d .gnb-inner-util .language .language-link::after,
.header-wrap.js-fixed .gnb-inner-util .language .language-link::after {background: url('../images/common/ico-arrow01.png') no-repeat center;}

.gnb-dimmed{position: fixed; top: 0px; left: 0; z-index: 999; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .5); display: none;}
.gnb-dimmed.js-open-d {display: block; top: 101px;}
.header-wrap.js-fixed .gnb-dimmed.js-open-d {top: 71px;}

.header-wrap.js-open-d .gnb-1dep > a {color: #494948;}
.header-wrap.js-fixed .gnb-1dep > a {color: #494948; line-height: 70px;}
.header-wrap.js-fixed .gnb-1dep > a span {line-height: 70px;}
.header-wrap .gnb-1dep.js-open-d > a {color: #21ad93;}

.header-wrap.js-fixed .gnb-1dep {height: 70px;}

.top__util {position: absolute; top: 50%; right: 45px; transform: translateY(-50%); z-index: 1001; font-size: 0; transition: all 0.3s ease-in-out;}
.top__util-item {display: inline-block; width: auto; text-align: center; vertical-align: middle;}
.top__util-item + .top__util-item {margin-left: 36px;}

.language {position: relative;}
.language .language-link {display: block; width: 24px; height: 24px; background: url('../images/common/language-ico.png') no-repeat 0 50%; font-size: 0; z-index: 3;}
.header-wrap.js-open-d .language .language-link,
.header-wrap.js-fixed .language .language-link {background: url('../images/common/language-ico_hover.png') no-repeat 0 50%;}

.language-wrap {position: absolute; top: 58px; left: 50%; transform: translateX(-50%); display: none; overflow: hidden; z-index: 2;}
.language-list {overflow: hidden;}

.language-list li+li {margin-top: 1px;}
.language-list li a {display: block; padding: 10px 25px; text-align: center; font-size: 14px; color:#fff; background: #222; transition: all 0.3s ease-in-out;}
.language-list li:first-child a,
.language-list li a:hover {background:#21ad93; font-weight: 700;}

.allmenu .allmenu-link {display: block; position: relative; width: 25px; height: 25px; overflow: hidden;}
.allmenu .allmenu-link span {display: block; height: 3px; width: 100%; border-radius: 5px; background: #fff; margin-top: 2.5px;}
.allmenu .allmenu-link span+span {margin-top: 5px;}

.header-wrap.js-open-d .allmenu .allmenu-link span,
.header-wrap.js-fixed .allmenu .allmenu-link span {background: #222;}

@media only screen and (max-width: 1440px) {
	.gnb-1dep > a {font-size: 16px;}
}

@media only screen and (max-width: 1240px) {
	.header-logo {left: 20px;}
	.header-logo a {width: 130px;}

	.top__util {right: 20px;}
	.top__util-item + .top__util-item {margin-left: 25px;}

	.gnb-1dep > a { padding: 0 20px; font-weight: 600;}

	.gnb-2dep > li > a {font-size: 14px;}
}

@media only screen and (max-width: 1024px) {
	.header-inner {text-align: left; height:70px;}
	.header-logo a {height: 40px;}

	.gnb {width:320px; height:100%; padding-right: 0; background:#fff; display:block; position:fixed; z-index:1001; top:0px; right:-100%;transition: all .3s ease-in-out; overflow-y:auto; }
	.gnb::before {display: none;}

	.gnb-wrap {margin:0; display: block;}
	.gnb.js-open-m {right:0;transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out;overflow-y:auto; z-index: 1002;}


	.gnb-1dep {display:block; font-size:16px; height:auto; position:relative; border-bottom: 1px solid #ddd; width:100%; max-width:100%;}
	.gnb-1dep:before {display:none;}
	.gnb-1dep > a {display:block; line-height:50px; height: 50px; padding:0 20px; color:#000; text-transform: none; margin:0; text-align: left;}
	.gnb-1dep > a::after {background: inherit;}
	.gnb-1dep > a span,
	.header-wrap.js-fixed .gnb-1dep > a span {line-height: 50px;}

	.gnb-1dep > a:hover,
	.gnb-1dep.js-open-m > a{color:#000 !important;}
	.gnb-1dep:hover > a span:after {display: none;}

	.gnb-1dep > a:after {position: absolute; left: auto; top: 20px; right: 16px; width: 10px; height: 10px; border-width: 0 0 1px 1px; border-style: solid; border-color: #000; content: '';  transition: all .3s ease-in-out;  transform: rotate(-135deg);}
	.gnb-1dep.js-open-m > a:after {top:20px; transition: all .3s ease-in-out; transform: rotate(-135deg);}

	.gnb-1dep > a.is-2depth-m:after {position: absolute; left: auto; top: 16px; right: 16px; width: 10px; height: 10px; border-width: 0 0 1px 1px; border-style: solid; border-color: #000; content: '';  transition: all .3s ease-in-out;  transform: rotate(-45deg);}
	.gnb-1dep.js-open-m > a.is-2depth-m:after {top:22px;transition: all .3s ease-in-out; transform: rotate(-225deg);}


	.gnb-2dep {height:auto; max-height:0; overflow:hidden; position:static; width:auto; margin:0; background-color:#efefef; border-top:0px solid #ddd; transition: all .3s ease-in-out; transform:translateX(0); border-radius: 0;}
	.gnb-1dep:last-child .gnb-2dep {margin-left:0;}

	.gnb-2dep > li {display: block; border-bottom:1px solid #ddd; padding:0; margin:0;}
	.gnb-2dep > li > a {display:block; padding: 0 30px; color:#666; text-align:left; line-height: 50px;}
	.gnb-2dep > li:last-child > a {padding-bottom: 0;}
	.gnb-2dep > li > a:hover,
	.gnb-2dep > li > a:focus {font-weight:400; padding: 0 30px; background: #21ad93; font-weight: 700; color: #fff;}
	.gnb-2dep > li > a:hover span {border-color: #fff;}
	.gnb-2dep > li:first-child > a,
	.header-wrap.js-fixed .gnb-2dep > li:first-child > a {padding-top: 0;}
	.gnb-2dep > li:last-child {margin-bottom:0px; border:0;}
	.gnb-2dep > li > a span {padding: 0;}
	.gnb-2dep > li > a span::after,
	.gnb-2dep > li > a:hover span::before,
	.gnb-2dep > li > a:hover span::after {display: none;}

	.header-wrap.js-fixed .gnb-1dep,
	.header-wrap.js-fixed .gnb-1dep > a {height: auto; line-height: 50px;}
	.gnb-1dep.js-open-m .gnb-2dep{max-height:1000px;border-top:1px solid #ddd;}

	.gnb-inner-util {display:block; position:relative; height:60px; background-color:#21ad93; padding:0 60px 0 0;font-size:0;}


	.gnb-mbtn-close {display:block; position: absolute; z-index: 3000; top: 0; right: 0; bottom: 0; width: 60px; min-height: 26px; margin: auto 0px; text-indent: -999em; -webkit-transition: none; transition: none; cursor: pointer; background:#3a3a3a; overflow:hidden; }
	.gnb-mbtn-close:before, .gnb-mbtn-close:after, .gnb-mbtn-close > span:before, .gnb-mbtn-close > span:after { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 25px; height: 0; border-top: 2px solid #fff; margin: auto; -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .3s; transition: .3s; content: ''; opacity: 1; }
	.gnb-mbtn-close:not(.zxcv):before { top: 16px; }
	.gnb-mbtn-close:not(.zxcv):after { bottom: 16px; }

	.js-open-m .gnb-mbtn-close {top:0px; right:0; min-height: 26px; }
	.js-open-m .gnb-mbtn-close:before, .js-open-m .gnb-mbtn-close:after, .js-open-m .gnb-mbtn-close > span:before, .js-open-m .gnb-mbtn-close > span:after {border-top: 2px solid #fff;  }
	.js-open-m .gnb-mbtn-close:before { width: 0; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
	.js-open-m .gnb-mbtn-close:after { width: 0; -webkit-transform: translateX(50%); -ms-transform: translateX(50%); transform: translateX(50%); }
	.js-open-m .gnb-mbtn-close > span:before { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }
	.js-open-m .gnb-mbtn-close > span:after { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }

	.gnb-mbtn {display:block; position: absolute; z-index: 1; top: 0; right: -5px; bottom: 0; width: 30px; min-height: 25px; margin: auto 0px; text-indent: -999em; -webkit-transition: none; transition: none; cursor: pointer; }

	.gnb-dimmed.js-open-m {display:block; top:0; z-index: 1001;}

	.top__util {right: 20px; top: 50%;}
	.top__util-item + .top__util-item {margin-left: 16px;}
	.header-logo {left: 20px; top: 50%;}
	.header-deco {display: none !important;}
}

@media only screen and (max-width: 480px) {
	.header-logo a {width: 100px;}
}


.newAllmenu {z-index:1005; position:relative; display: none;}
.newAllmenu-wrap {position: fixed; width:100%; height:100%; top:0; left:0; z-index: 1001; overflow:hidden; background:url('../images/common/allmenu-bg.png') no-repeat right bottom / cover;}

.newAllmenu-tit {border: 2px solid #e5f7f3; padding: 30px 45px; height: 102px;}
.newAllmenu-tit .logo a {font-size: 0; display: block; width: 156px; height: 42px; background: url('../images/common/footer-logo.png') no-repeat center / contain;}

.newAllmenu-inner {display:block; height: 100vh;}

.newAllmenu-close {display:block; position: fixed; right: 45px; top: 50px; transform: translateY(-50%) rotate(45deg); width: 30px; height: 30px; z-index:1002; padding:0; font-size:0; text-indent:-8888888px;}
.newAllmenu-close span {display: block; width: 3px; height: 11px; background: #21ad93; position: absolute; transition: all 0.3s ease-in-out;}
.newAllmenu-close span:nth-of-type(1) {top: 0; left: 50%; transform: translateX(-50%);}
.newAllmenu-close span:nth-of-type(2) {width: 11px; height: 3px; top: 50%; right: 0; transform: translateY(-50%);}
.newAllmenu-close span:nth-of-type(3) {bottom: 0; left: 50%; transform: translateX(-50%);}
.newAllmenu-close span:nth-of-type(4) {width: 11px; height: 3px; top: 50%; left: 0; transform: translateY(-50%);}

.newAllmenu-close:hover span:nth-of-type(odd) {height: 40px;}
.newAllmenu-close:hover span:nth-of-type(even) {width: 40px;}
.newAllmenu-nav {display: flex; height: calc(100% - 102px); max-width:1400px; margin:0 auto; border-right: 1px solid #e5f7f3; position:relative;}
.newAllmenu-nav::after {display: block; content: ""; width: 0px; height: 0px; border-top: 10px solid #e5f7f3; border-right: 10px solid transparent; border-left: 10px solid transparent; position: absolute; right: 0; top: 0; transform: translateX(50%);}
.newAllmenu-nav::before {display: block; content: ""; width: 0px; height: 0px; border-bottom: 10px solid #e5f7f3; border-right: 10px solid transparent; border-left: 10px solid transparent; position: absolute; right: 0; bottom: 0; transform: translateX(50%); z-index: 1;}

.newAllmenu-1dep {width: 20%; padding: 100px 0; transition: all 0.5s ease-in-out; border-left: 1px solid #e5f7f3; position: relative;}
.newAllmenu-1dep::after {display: block; content: ""; width: 0px; height: 0px; border-top: 10px solid #e5f7f3; border-right: 10px solid transparent; border-left: 10px solid transparent; position: absolute; left: 0; top: 0; transform: translateX(-50%);}
.newAllmenu-1dep::before {display: block; content: ""; width: 0px; height: 0px; border-bottom: 10px solid #e5f7f3; border-right: 10px solid transparent; border-left: 10px solid transparent; position: absolute; left: 0; bottom: 0; transform: translateX(-50%); z-index: 1;}
.newAllmenu-1dep > a {display:block; padding-left: 20px; font-size: 30px; font-weight: 700; text-transform: uppercase; color:#464646; transition: all 0.5s ease-in-out;}
.newAllmenu-1dep:hover > a {color: #21ad93;}

.newAllmenu-2dep {margin-top: 40px; transition: all 0.5s ease-in-out; width: 100%; transition: all 0.3s ease-in-out;}
.newAllmenu-2dep > li > a {display:block; padding: 20px; color:#7b7c7e; font-size:20px; font-weight: 500; line-height:1.3; position: relative; transition: all 0.3s ease-in-out;}
.newAllmenu-1dep .newAllmenu-2dep > li > a::before {display: block; content: ""; width: 0px; height: 0px; border-radius: 50%; background: #e5f7f3; position: absolute; top: 50%; left: 0; transform: translate(-50%, -50%); transition: all 0.3s ease-in-out;}
.newAllmenu-1dep .newAllmenu-2dep > li > a::after {display: block; content: ""; width: 0px; height: 0px; border-radius: 50%; background: #21ad93; position: absolute; top: 50%; left: 0; transform: translate(-50%, -50%); transition: all 0.3s ease-in-out;}
.newAllmenu-1dep .newAllmenu-2dep > li:hover > a {color: #21ad93;}
.newAllmenu-1dep .newAllmenu-2dep > li:hover > a::after {width: 9px; height: 9px;}
.newAllmenu-1dep .newAllmenu-2dep > li:hover > a::before {width: 15px; height: 15px;}

@media only screen and (max-width: 1440px) {
	.newAllmenu-1dep > a {font-size: 25px;}

	.newAllmenu-2dep {margin-top: 30px;}
	.newAllmenu-2dep > li > a {padding: 15px 20px; font-size: 18px;}
}

@media only screen and (max-width: 1024px) {
	.newAllmenu {display: none !important;}
}


.visual__contents-inner {position: relative; text-align: center;}
.visual__contents-inner .side-util {position: absolute; top: calc(100% - 60px); z-index: 4;}

.sub_visual {padding: 15% 0 10%; min-height: 400px; background-size: cover; position: relative; font-size: 0; overflow: hidden;}

.sub_visual-inner {margin: 0 auto; max-width: 1400px; position: relative;}

.sub_visual-bg {display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: scale(1.5); transition: all 10s ease-in-out; background:url('../images/contents/visual_bg01.jpg') no-repeat center top / cover;}
.sub_visual-bg.is-active {transform: scale(1);}
.sub_visual.nth-2 .sub_visual-bg {background-image: url(../images/contents/visual_bg02.jpg);}
.sub_visual.nth-3 .sub_visual-bg {background-image: url(../images/contents/visual_bg03.jpg);}
.sub_visual.nth-4 .sub_visual-bg {background-image: url(../images/contents/visual_bg04.jpg);}
.sub_visual.nth-5 .sub_visual-bg {background-image: url(../images/contents/visual_bg05.jpg);}

.sub_title h2 {display: inline-block; font-size: 35px; font-weight: 700; color: #fff; letter-spacing: 0.25em; text-transform: uppercase; position: relative;}
.sub_title h2::after {display: block; content: ""; width: 24px; height: 25px; background: url('../images/common/sub_title.png') no-repeat center; position: absolute; top: -38px; right: 0;}

.sub_visual-inner .lnb-list {margin-top: 20px; justify-content: center; align-items: center;}
.sub_visual-inner .lnb-item {position: relative; margin-right: 20px;}
.sub_visual-inner .lnb-item+.lnb-item::after {display: block; content: ""; width: 7px; height: 10px; background: url('../images/common/arrow02.png') no-repeat center / contain; position: absolute; top: 50%; left: -14px; transform: translateY(-50%); opacity: 0.5;}
.sub_visual-inner .lnb-item:last-child {margin-right: 0;}
.sub_visual-inner .lnb-item a {display: block; font-size: 14px; font-weight: 400; color: rgba(255, 255, 255, 0.5);}

.lnb-home {width: 20px; height: 20px;}
.lnb-home a {display: block; font-size: 0 !important; width: 100%; height: 100%; background: url('../images/common/ico-home.png') center center no-repeat; opacity: 0.4; transition: all 0.3s ease-in-out; position: relative;}
.lnb-home a:hover {opacity: 1;}

@media only screen and (max-width: 1620px) {
	.visual__contents-inner .side-util {top: calc(50% - 10px);}
}

@media only screen and (max-width: 1240px) {
	.sub_visual {padding: 18% 0 8%;}
}

@media only screen and (max-width: 1024px) {
	.sub_visual {padding: 22% 0 8%;}
	.visual__contents-inner .side-util {top: calc(50% - 30px);}

	.sub_title h2 {font-size: 30px;}
}

@media only screen and (max-width: 768px) {
	.sub_visual {min-height: 350px;}

	.sub_visual-inner .lnb-list {margin-top: 10px;}
	.sub_visual-inner .lnb-item a {font-size: 12px;}
}

@media only screen and (max-width: 640px) {
	.sub_visual {padding: 150px 0 10%;}

	.sub_title h2 {font-size: 24px;}
}

@media only screen and (max-width: 480px) {
	.sub_visual {padding: 150px 0 3%;}

	.sub_title h2 {font-size: 20px;}
}



.lnb {width: 100%; text-align: center; z-index: 3; position: relative; transform: translateY(-100%);}

.lnb-wrap {max-width: 1400px; margin: 0 auto; position: relative;}
.lnb-title {display: none;}
.lnb-title a {display: block; height: 60px; width: 100%; font-size: 16px; font-weight: 500; letter-spacing: -0.025em; color: #fff; background: rgba(0, 0, 0, 0.4); line-height: 60px; position: relative;}
.lnb-title a::after {display: block; content: ""; width: 6px; height: 13px; background: url('../images/common/arrow02.png') no-repeat center / contain; transform: translateY(-50%) rotate(90deg); position: absolute; top: 50%; right: 20px; transition: all 0.3s ease-in-out;}
.lnb-title a.on::after {transform:  translateY(-50%) rotate(-90deg);}


.lnb-list {display: flex; position: relative;}
.lnb-wrap .lnb-list > li {width: 100%; vertical-align: top;}

.lnb-wrap .lnb-item {height: 60px; box-sizing: border-box;}
.lnb-wrap .lnb-item+.lnb-item {margin-left: 1px;}
.lnb-wrap .lnb-item a {display: block; height: 60px; font-size: 16px; font-weight: 500; letter-spacing: -0.025em; color: #fff; background: rgba(0, 0, 0, 0.4); line-height: 60px; position: relative;}
.lnb-wrap .lnb-item.on a,
.lnb-wrap .lnb-item:hover a {background: #fff; color: #11af90; font-weight: 700;}


.contents__title {margin-top: 6px;}
.contents__title h3 {padding-bottom: 60px; font-size: 40px; font-weight: 700; color: #222; text-align: center; border-bottom: 1px solid #e4e4e4;}

@media only screen and (max-width: 1240px) {
	.lnb-wrap .lnb-item a {font-size: 15px;}

	.contents__title h3 {font-size: 34px;}
}

@media only screen and (max-width: 768px) {
	.lnb-wrap .lnb-item a {font-size: 14px;}

	.contents__title {margin-top: 0;}
	.contents__title h3 {font-size: 28px; padding-bottom: 40px;}
}

@media only screen and (max-width: 480px) {
	.lnb-title {display: block;}
	.lnb .lnb-list {position: absolute; top: 100%; left: 0; max-height: 0; width: 100%; overflow: hidden; flex-wrap: wrap; transition: all 0.3s ease-in-out;}
	.lnb .lnb-list.on {max-height: 500px;}
	.lnb-wrap .lnb-item a {background: rgba(0, 0, 0, 0.9);}
	.lnb-wrap .lnb-item+.lnb-item {margin-top: 1px;}

	.contents__title h3 {font-size: 20px;}
}




.footer {background: #1a1a1a; position: relative; padding: 0 0 40px;}

.footer-top {position: absolute; top: 0; right: 0; width: 76px; height: 64px; background: url('../images/common/footer-top.png') no-repeat center; font-size: 0;}
.footer-top:hover {background-color: #44d2b8;}

.footer-menu {display: flex; justify-content: flex-end; padding-right: 76px;}
.footer-menu-item a {display: block; background: #21ad93; padding: 20px; font-size: 16px; font-weight: 700; color: #fff; text-align: center; line-height: 24px; position: relative;}
.footer-menu-item+.footer-menu-item a::after {display: block; content: ""; width: 1px; height: 14px; background: rgba(150, 211, 222, 0.5); position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.footer-menu-item:hover a {background: #fff; color: #000;}

.footer-wrap {margin-top: 40px; display: flex;}

.footer-logo {font-size: 0; width: 20%;}
.footer-logo a {display: block; width: 158px; height: 42px; background: url('../images/common/footer-logo.png') no-repeat center;}

.footer-item+.footer-item {margin-top: 30px;}
.footer-item .title {display: inline-block; font-size: 16px; font-weight: 700; color: #21ad93; letter-spacing: 0.05em; padding-bottom: 5px; border-bottom: 1px solid #21ad93;}
.footer-item .text {margin-top: 5px;}
.footer-item .text span {vertical-align: baseline; font-size: 16px; font-weight: 400; letter-spacing: 0.1em; line-height: 1.4; color: #fff;}
.footer-item .text span+span {margin-left: 40px;}
.footer-item:last-child .text span {font-size: 14px;}
.footer-item .text span em {vertical-align: baseline; font-weight: 700;}

.footer-copy {margin-top: 40px; font-size: 14px; font-weight: 400; letter-spacing: 0.26em; line-height: 1.4; color: #4b4c4c;}

@media only screen and (max-width: 1440px) {
	.footer-item .text span {display: block;}
	.footer-item .text span+span {margin-left: 0; margin-top: 5px;}
}

@media only screen and (max-width: 1240px) {
}

@media only screen and (max-width: 1024px) {
	.footer-wrap {flex-wrap: wrap; justify-content: center;}

	.footer-logo {width: 100%; margin-bottom: 50px;}
	.footer-logo a {margin: 0 auto;}

	.footer-menu {justify-content: center; padding-right: 0;}

	.footer-wrap address {text-align: center;}

	.footer-copy {text-align: center;}
}

@media only screen and (max-width: 768px) {
	.footer-logo a {background-size: contain;}

	.footer-menu {padding-right: 0;}
	.footer-menu .footer-menu-item a {font-size: 14px; padding: 10px 15px;}
	.footer-item .text span {font-size: 15px;}
}

@media only screen and (max-width: 640px) {
	.footer-top {top: 50px;}

	.footer-menu,
	.footer-menu .footer-menu-item {width: 100%;}
	.footer-menu .footer-menu-item a {white-space: nowrap;}

	.footer-item .text span {font-size: 14px;}

	.footer-copy {font-size: 13px;}
}

@media only screen and (max-width: 480px) {
	.footer-top {top: 190px;}

	.footer-menu {flex-wrap: wrap;}
	.footer-menu .footer-menu-item+.footer-menu-item {margin-top: 1px;}

	.footer-logo {margin-bottom: 30px;}
	.footer-logo a {width: 140px;}

	.footer-item .text span,
	.footer-item:last-child .text span {font-size: 12px;}

	.footer-top {width: 70px;}
}