@charset "UTF-8";

html { overflow-x: hidden; }

.container { margin: 0 auto; max-width: 1400px; }

.row { margin-left: -0.75rem; margin-right: -0.75rem; }

#wrap { width: 100%; height: 100%; /*padding-top: 17rem;*/}

#header { position:relative; width: 100%; background-color: #fff; z-index: 90; -webkit-box-shadow: 0 1rem 1rem rgba(0, 0, 0, 0.03); box-shadow: 0 1rem 1rem rgba(0, 0, 0, 0.03); -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
#header.fixed { position: fixed; top: 0; left: 0; } 
#header .bg_depth2 { position: absolute; top: 80px; left: 0; width: 100%; height: 0; background-color: #fff; -webkit-transition: all .3s; transition: all .3s; }

#header .area1 { height: 9.2rem; padding: 2.2rem 0; position: relative;}

#header .area2 { border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; }

#header .logo { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }

#header .special { display: inline-block; vertical-align: middle; }

#header .util { float: right; margin-top: .7rem; }

#header .util ul { display: inline-block; }

#header .util li { position: relative; display: inline-block; vertical-align: middle; }

#header .util li a { display: block; font-size: 1.4rem; color: #555; text-transform: uppercase; }

#header .util li ~ li { position: relative; padding-left: 1rem; margin-left: .7rem; }

#header .util li ~ li::before { content: ''; display: block; width: 1px; height: 1rem; background-color: #ddd; position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); }

#header .pop_open { display: inline-block; vertical-align: middle; font-size: 1.3rem; color: #000; text-transform: uppercase; border: 1px solid #ddd; border-radius: 3px; width: 16rem; padding: 1rem 1.2rem; margin-left: 2rem; font-weight: 500; }

#header .pop_open i { margin-left: 3rem; -webkit-transform: rotate(180deg); transform: rotate(180deg); -webkit-transition: .2s; transition: .2s; }

#header .pop_open.active i { -webkit-transform: rotate(0deg); transform: rotate(0deg); }

#header .area2 .container { position: relative; }

#header #nav { padding-right: 13rem; }

#header #nav .btn_sch_open { font-size: 3rem; position: absolute; right: 10rem; top: 1.8rem; color: #000000; }

#header .sch_layer { display: none; position: absolute; left: 50%; top: 7.6rem; z-index: 4; background: #fff; width: 200%; -webkit-transform: translateX(-50%); transform: translateX(-50%); text-align: center; padding: 3rem 0; -webkit-box-shadow: 0 1rem 1rem rgba(0, 0, 0, 0.07); box-shadow: 0 1rem 1rem rgba(0, 0, 0, 0.07); border-top: 1px solid #ddd; }

#header .sch_layer .title { font-size: 3rem; color: #46464a; margin-right: 4rem; display: inline-block; vertical-align: middle; }

#header .sch_layer input[type=text] { border: 0; border-bottom: 1px solid #000; color: #727272; font-size: 2rem; width: 50rem; padding: 1.5rem 5rem 1.5rem 1.5rem; }

#header .sch_layer input[type=text]::-webkit-input-placeholder { color: #b9b9b9; }

#header .sch_layer input[type=text]:-ms-input-placeholder { color: #b9b9b9; }

#header .sch_layer input[type=text]::-ms-input-placeholder { color: #b9b9b9; }

#header .sch_layer input[type=text]::placeholder { color: #b9b9b9; }

#header .sch_layer .btn_sch { font-size: 2.5rem; color: #242427; margin-left: -5rem; vertical-align: middle; }

#header .sch_layer .btn_sch_close { position: absolute; right: 10rem; top: 1rem; }

#header .sch_layer .btn_sch_close i { color: #3e77c6; font-size: 3rem; font-weight: 700; }

#header #nav > #gnb, #content {width: 100%}
#content {min-height: 75rem;}

#header #nav > #gnb > ul { display: -ms-flex; display: -webkit-box; display: -ms-flexbox; display: flex; }

#header #nav > #gnb > ul > li { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; position: relative; }

#header #nav > #gnb > ul > li > a { font-size: 2rem; padding: 2.6rem 0 2.5rem 3rem; display: block; font-weight: 500; color: #000; font-family: var(--signature-font);}

#header #nav > #gnb > ul > li.active > a::before, #header #nav > ul > li > a::before, #header #nav > #gnb > ul > li > a:hover::before { content: ''; display: block; width: 0%; height: .9rem; position: absolute; left: 35%; top: 56%; z-index: -1; background-color: #fdb913; -webkit-transform: translateX(-50%); transform: translateX(-50%); -webkit-transition: all 0.2s ease; transition: all 0.2s ease; }

#header #nav > #gnb > ul > li .depth2 { text-align: left; opacity: 0; height: 0; overflow: hidden; visibility: hidden; position: absolute; top: 7.6rem; width: 100%; z-index: 2; -webkit-transition: height 0.3s ease; transition: height 0.3s ease; padding: 1.2rem 0 1.2rem 1.2rem; border-left: 1px solid #0f151d; }

#header #nav > #gnb > ul > li:last-child .depth2 { border-right: 1px solid #0f151d; }

#header #nav > #gnb > ul > li .depth2 a { color: #bfc6d1; display: block; padding: .55rem .7rem; }

#header #nav > #gnb > ul > li .depth2 a:hover { color: #fdb913; }

#header #nav > #gnb > ul > li .depth3 { display: none; }

#header #nav.active #gnb .depth2 { opacity: 1; visibility: visible; height: 34.1rem; }

#header #nav > #gnb > ul > li.active > a::before, #header #nav.active #gnb > ul > li:hover > a::before { width: 50%; }

#header #nav.active #gnb > ul > li:hover .depth2 { background-color: #141c28; }

#header #nav #gnb > ul::after { display: block; position: absolute; top: 7.6rem; left: 50%; width: 200%; height: 0px; -webkit-transition: all .3s ease; transition: all .3s ease; -webkit-transform: translateX(-50%); transform: translateX(-50%); background-color: #232d3c; content: ""; }

#header #nav.active #gnb > ul::after { height: 34.1rem; }

#wrap.allmenu-pop, #wrap.rnd-pop { height: 100vh; overflow: hidden; }

#wrap.allmenu-pop #header { z-index: 20; }

#wrap.allmenu-pop .popup.active + #header { margin-top: -15rem; }

#wrap.allmenu-pop #header::after { content: ''; position: fixed; left: 0; top: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.7); }

#wrap.allmenu-pop #nav { background-color: #fff; z-index: 27; }

#wrap.allmenu-pop #nav h2.title { width: auto; height: auto; position: static; display: block; text-transform: uppercase; padding: 5rem; font-family: 'play', sans-serif; color: #132f57; font-size: 3.5rem; }



#wrap.allmenu-pop #gnb > ul { display: block !important; position: absolute; left: 50%; top: 12rem; z-index: 9; width: 100%; height: 70vh; background-color: #fff; -webkit-transform: translateX(-50%); transform: translateX(-50%); overflow-x: hidden; overflow-y: scroll; padding: 0 5rem 5rem; }

#wrap.allmenu-pop #nav > #gnb > ul > li > a { font-size: 2.8rem; border-top: 3px solid #000; padding: 3rem 0 0 0; width: 20%; }

#wrap.allmenu-pop #nav > #gnb > ul > li .depth2 { -webkit-box-flex: 5; -ms-flex: 5; flex: 5; position: static; -webkit-transform: none; transform: none; }

#wrap.allmenu-pop #nav > #gnb > ul > li { display: -ms-flex; display: -webkit-box; display: -ms-flexbox; display: flex; }

#wrap.allmenu-pop #nav #gnb .depth2 { display: -ms-flex; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; opacity: 1; visibility: visible; height: auto; border-left: 0; border-top: 1px solid #ddd; padding: 3rem; }

#wrap.allmenu-pop #nav.active #gnb .depth2 { height: auto; }

#wrap.allmenu-pop #nav > #gnb > ul > li .depth3 { display: block; margin: 2rem 1rem 3rem; }

#wrap.allmenu-pop #nav.active #gnb > ul::after { display: none; }

#wrap.allmenu-pop .tsidemenu { top: 0; }

#wrap.allmenu-pop #nav.active #gnb > ul > li > a::before { display: none; }

#wrap.allmenu-pop #nav.active #gnb > ul > li:hover .depth2 { background-color: transparent; }

#wrap.allmenu-pop #nav > #gnb > ul > li .depth2 > li > a { font-size: 2rem; color: #000; }

#wrap.allmenu-pop #nav > #gnb > ul > li .depth3 > li > a { color: #555; position: relative; padding-left: 1rem; }

#wrap.allmenu-pop #nav > #gnb > ul > li .depth3 > li > a::before { content: ''; display: block; width: 0.4rem; height: 0.4rem; background-color: #a2a2a2; position: absolute; left: 0; top: 1.5rem; border-radius: 50%; }

#wrap.allmenu-pop #nav #gnb .depth2 > li { width: 25%; }

#wrap.allmenu-pop #nav > #gnb > ul > li:last-child .depth2 { border-right: 0; }

#wrap.allmenu-pop #header #nav > #gnb > ul > li > a::before { display: none; }

#wrap.allmenu-pop #nav .btn_sch_open { display: none; }

#header .tsidemenu { position: absolute; top: -1px; right: 0; }

#header .tsidemenu .menu-trigger { display: block; position: relative; z-index: 20; width: 7.2rem; height: 7.8rem; padding-top: 2.4rem; background-color: #132f57; }

#header .tsidemenu .menu-trigger > span { display: block; width: 2.3rem; height: 2px; margin: 6px auto 0; background: #fff; -webkit-transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55); transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55); -webkit-backface-visibility: hidden; backface-visibility: hidden; }

#header .tsidemenu .menu-trigger.active { background-color: #fdb913; }

#header .tsidemenu .menu-trigger.active > span.bar1 { -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: 1.5rem; width: 4rem; }

#header .tsidemenu .menu-trigger.active > span.bar2 { opacity: 0; width: 0; }

#header .tsidemenu .menu-trigger.active > span.bar3 { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); margin-top: -1.1rem; width: 4rem; }

#header .tsidemenu .menu-trigger > strong span:first-child {display: block;}
#header .tsidemenu .menu-trigger > strong span:last-child {display: none;}

#header .tsidemenu .menu-trigger.active > strong span:first-child {display: none}
#header .tsidemenu .menu-trigger.active > strong span:last-child {display: block}

#header .tsidemenu .sitemap-wrap { display: none; }

#header .rnd-wrap, #header .rnd-wrap .rnd-list { display: none; }

.go-top { position: fixed; text-align: center; right: 2.5rem; bottom: 2.5rem; z-index: 10; display: block; width: 6rem; height: 6rem; padding-top: 1rem; border-radius: 50%; background-color: #889; color: #fff; opacity: 0; visibility: hidden; -webkit-transition: all .3s; transition: all .3s; }

.go-top i { font-size: 2rem; }

.go-top span { display: block; font-size: 1.5rem; line-height: 1; }

.go-top:hover { background-color: #50505A; }

.go-top.active { opacity: 1; visibility: visible; }

#footer { background-color: #262626; position: relative; height: 20rem; padding-top: 4rem; }

#footer::before { content: ''; display: table; }

#footer .container { position: relative; }

#footer h1 { float: left; }

#footer .info { margin-left: 300px; font-size: 1.4rem; color: #939393; line-height: 1.5; }

#footer .info a { color: #aaa; transition: all .3s ease; -webkit-transition: all .3s ease; }
#footer .info a.point { color: #fdb913;font-weight: 700;}
#footer .info a:hover { color: #fff; text-decoration: underline; }

#footer .info .rules { overflow: hidden; margin-bottom: 15px; margin-left: -15px; }

#footer .info .rules > li { float: left; padding: 0 15px; position: relative; }

#footer .info .rules > li::after { content: ""; width: 1px; height: 9px; background-color: #9699a0; position: absolute; top: 4px; left: 0; }

#footer .info .rules > li:first-child::after { display: none; }

#footer .info address { margin-top: 1.5rem; }

#footer .info .tel_info {overflow: hidden;margin-bottom: 15px;margin-left: -15px;margin-top: 15px;}

#footer .info .tel_info > li {float: left;padding: 0px 15px 0px 15px;position: relative;}

#footer .info .tel_info > li::after { content: ""; width: 1px; height: 9px; background-color: #9699a0; position: absolute; top: 4px; left: 0; }

#footer .info .tel_info > li:first-child::after { display: none; }

#footer .family-site { position: absolute; top: 0; right: 0; }

#footer .family-site > img {margin-right: 2rem; vertical-align: middle;}

#footer .family-site button { width: 250px; height: 38px; background-color: #141414; color: #aaa; font-size: 1.4rem; text-align: left; padding-left: 20px; position: relative; }

#footer .family-site button::after { content: ""; border-width: 5px; border-color: transparent transparent #8d8f94; border-style: solid; position: absolute; top: 50%; right: 20px; margin-top: -10px; -webkit-transform: rotate(0); transform: rotate(0); -webkit-transition: all .3s; transition: all .3s; }

#footer .family-site .depth-list { background-color: #141414; position: absolute; bottom: 38px; left: 0; width: 100%; display: none; z-index: 2;}

#footer .family-site .depth-list > li { border-bottom: 1px solid #343b46; }

#footer .family-site .depth-list > li > a { display: block; height: 38px; font-size: 1.4rem; color: #aaa; padding: 11px 20px; -webkit-transition: all .3s; transition: all .3s; }

#footer .family-site .depth-list > li > a:hover { background-color: #0b0f18; color: #fff; }

#footer .family-site.active button::after { margin-top: -5px; -webkit-transform: rotate(180deg); transform: rotate(180deg); }

.header-dimmed { width: 100%; height: 100%; position: fixed; top: 0; left: 0; display: none; opacity: 0; background-color: #000; z-index: 10; }

/* 2018.11.13 사이트 오픈 안내 팝업레이어 추가 */
#popup-layout.popup-layout { display: none;  position:fixed; top:0; left:0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5);z-index: 100;}
#popup-layout.popup-layout .popup-layer {
    display: inline-block;
    max-width: 100%;
	}
#popup-layout.popup-layout .popup-scroll-content { padding: 0; height: auto; }
#popup-layout.popup-layout .popup-bottom { padding: 0 15px; height: 30px; line-height: 30px; font-size: 1.4rem; color: #fff; background-color: #000; }
#popup-layout.popup-layout .popup-bottom a { color: inherit; }

/* 2018.10.31 모바일 전용 요소 */
.mobile-only { display: none; }

/* to Top */
a.top { position: fixed; right: 50px; bottom: 50px; z-index: 10; display: none; width: 50px; height: 50px; background: url(../images/korean/sub/bg_top.gif) center center no-repeat #b3b7c2; border-bottom: 1px solid #7e8394; }

/* 퀵메뉴 */
.quick-menu {	
    display: flex; align-items: center;
    position: fixed;
	top: 50%;
	right: 0;
    transition: .3s;
	transform: translateY(-50%);
	z-index: 90;
	}
.quick-menu .quick-menu-btn {
	display: none;
	width: 3.9rem;
	height: 3.5rem;
	background-color: #FDB913;
	border-radius: .5rem 0 0 .5rem;
	}
.quick-menu .quick-menu-btn .arrow {	
	display: block;
	width: 1.1rem;
	height: 1.2rem;
	background: url("../images/korean/common/quick_arrow.png") no-repeat 0 0;	
	}
.quick-menu.active .arrow {
	transform: rotate(180deg)
	}
	
.quick-list {
	padding: 0.4rem 0;
	background-color: #3A4454;
	border-radius: 1rem 0 0 1rem;
	color: #fff;
    text-align: center;
	font-size: 1.4rem;
	overflow: hidden;
	}
.quick-list > li + li {
	border-top: 1px solid #5D6778;
	}
.quick-list > li a {
	display: block;
    padding: 1.45rem 1.28rem;
    line-height: 1.5;
	}
.quick-list > li a > span,
.quick-list > li a > span {
	display: inline-block;
    position: relative;
	}
.quick-list > li > a span::after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 1px;
    background-color: #fff;
    transition: .3s;
    content: "";
	}
.quick-list > li > a:hover span::after, 
.quick-list > li > a:focus span::after {
    width: 100%;
	}
.quick-list .icon {	
	display: block;
	margin-bottom: 0.5rem;
	}
@media (max-width:1640px) {
    .quick-menu {transform: translate(9rem, -50%);}
    .quick-menu .quick-menu-btn {display: flex; align-items: center; justify-content: center;} 
    .quick-menu.active {transform: translate(0, -50%);}
}
@media (max-width: 1279px) { 
.container { width: 100%; }
#header .sch_layer { width: 100%; } 
#footer .family-site {top : 7rem}
}
@media (max-width: 1100px) {
#footer {padding: 3rem 2rem 0;}	
#footer h1 {float: none; margin-bottom: 2rem}	
#footer .info {margin-left: 0;}
#footer .family-site {top: 0}
#header .pop_open {width: 13rem; margin-left: .5rem; padding: 1rem; text-align: left;}
#header .pop_open i {margin-left: 0.5rem;}
#header .util li ~ li {margin-left: .3rem; padding-left: .4rem; }
}

@media (max-width: 991px) {
/*#wrap {padding-top: 14rem;}*/
/*.container{padding-left: 1rem!important;padding-right: 1rem !important; }*/
  #header .special, #header .pop_open, #header #nav > #gnb > ul { display: none; }
  #header .area2 { border: 0; }
  #header #nav { padding-right: 0; }
  #header #nav .btn_sch_open { right: inherit; left: 1rem; top: -6.5rem; }
  #header .util .eng::before { display: none; }
  #header .util .eng a {position: relative; padding-left: 3.2rem; font-size: 1.8rem; color: #333; margin-right: 1rem; font-weight:bold; }
  #header .util .eng a::before {display: block; position: absolute; top: -.4rem; left: 0; color: #111; vertical-align: middle; line-height: 1;  font-family: xeicon; font-size: 3rem;  font-weight:400; content: '\e9d1'; }
  #header .util li ~ li {margin-left: .3rem; padding-left: .5rem;}
  #header .util li ~ li.eng {margin-left: 0; padding-left: 0;}
  /*#header .util .eng a::before { content: '\e9d1'; font-family: xeicon; font-size: 3rem; color: #111; }*/
  #header .sch_layer { top: 0; left: 0; -webkit-transform: none; transform: none; z-index: 21; }
  #header .sch_layer input[type=text] { width: 90%; }
  #header .sch_layer .btn_sch { position: relative; }
  #header .sch_layer .btn_sch_close { background-color: #fff; right: inherit; left: 1rem; top: -9.3rem; }
  #header .tsidemenu .menu-trigger { width: auto; height: 4.8rem; line-height: 4.8rem; text-align: center; font-size: 1.7rem; padding-top: 0; }
  #header .tsidemenu .menu-trigger span { display: none; }
  #header .tsidemenu .menu-trigger > strong span:FIRST-CHILD {display: inline-block;}
  #header .tsidemenu .menu-trigger.active > strong span:LAST-CHILD {display: inline-block;}
  #header .tsidemenu .menu-trigger strong { position: static; width: auto; height: auto; margin: 0; color: #fff; font-weight: 400; }
  #header .tsidemenu .menu-trigger strong::before { content: '\e91c'; display: inline-block; font-family: xeicon; margin-right: .5rem; }
  #header .rnd.active, #header .tsidemenu .menu-trigger.active strong { background-color: #fdb913; color: #132f57; font-weight: 700; }
  #header .tsidemenu { width: 50%; right: auto; left: 0; top: 0; }
  #wrap.allmenu-pop .popup.active + #header { margin-top: 0; }
  #wrap.allmenu-pop #header::after { display: none; }
  #wrap.allmenu-pop #nav h2.title { display: none; }
  #wrap.allmenu-pop #gnb>ul { top: 4.8rem; padding: 0; height: 100vh; }
  #wrap.allmenu-pop #gnb::before { content: ''; display: block; width: 30%; height: 100%; background-color: #f6f6f8; position: absolute; left: 0; top: 0; z-index: -1; border-right: 1px solid #d6d8de; }
  #wrap.allmenu-pop #nav > #gnb > ul > li { position: static; margin-top: -1px; }
  #wrap.allmenu-pop #nav > #gnb > ul > li > a { border-top: 0; font-size: 2rem; width: 30%; text-align: center; border-top: 1px solid #e6eaef; border-bottom: 1px solid #e6eaef; padding: 2rem 0; }
  #wrap.allmenu-pop #nav > #gnb > ul > li.active > a { background-color: #ffffff; border-color: #d6d8de; position: relative; }
#wrap.allmenu-pop #nav > #gnb > ul > li .depth2 { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: absolute; top: 1rem; left: 30%; width: 70%; padding: 1rem; border-top: 0; opacity: 0; visibility: hidden; }
  #wrap.allmenu-pop #nav #gnb .active .depth2 { opacity: 1; visibility: visible; }
  .rnd-wrap .rnd-list li, #wrap.allmenu-pop #nav #gnb .depth2 > li { width: auto; margin-bottom: 1rem; position: relative; }
  .rnd-wrap .rnd-list li a, #wrap.allmenu-pop #nav > #gnb > ul > li .depth2 > li > a { display: block; font-size: 1.8rem; border: 1px solid #d2d4da; padding: 1.2rem; color: #000; }
  #wrap.allmenu-pop #nav > #gnb > ul > li .depth3 { display: none; }
  #wrap.allmenu-pop .depth2 > li.is-depth3 > a::before { content: '\e942'; font-family: xeicon; font-size: 1.8rem; display: block; position: absolute; right: 1.4rem; top: 1.3rem; z-index: 2; color: #aaa; -webkit-transition: all .2s; transition: all .2s; }
  #wrap.allmenu-pop .depth2 > li.is-depth3.active > a::before { -webkit-transform: rotate(180deg); transform: rotate(180deg); }
  #wrap.allmenu-pop #nav #gnb li.is-depth3.active .depth3 { display: block; margin: 1rem; }
  #wrap.allmenu-pop #nav .btn_sch_open { display: block; }
  #header .rnd-wrap { display: block; }
  #wrap.allmenu-pop #nav #gnb .rnd-wrap .depth2 {display: none;}
  #header .rnd { background-color: #132f57; color: #fff; position: absolute; left: 50%; width: 50%; height: 4.8rem; text-align: center; font-size: 1.7rem; border-left: 1px solid #425979; }
  #header .rnd i { margin-right: .5rem; }
  #wrap.rnd-pop #header .rnd-list { display: block; position: absolute; top: 4.8rem; left: 0; background-color: #fff; width: 100%; height: 100vh; padding: 1rem; } 
}

/* 모바일 */
@media (max-width: 767px) {
  /* layer popup */
/*#wrap {padding-top: 11rem;}*/
  .popup-layout#popup-layout3 .popup-layer {width:100%; max-height:500px; overflow:auto;}
  .popup-layout#popup-layout3 .popup-bottom {position:absolute; bottom:-30px; width:100%;}

  .mobile-only { display: block; }
  #header .area1 { height: 7.1rem; padding: 1rem 0; position: relative;}
  #header .logo { width: 22.5rem; }
  #header #nav .btn_sch_open { top: -5.5rem; }
  #header .sch_layer .btn_sch_close { top: -8.3rem; }
  #header .util .recruit, #header .util .notice { display: none; }
  #footer { height: inherit;  padding-top: 0; }
  #footer h1 { display: none; }
  #footer .info { margin-left: 0; padding: 0 2rem; font-size: 1.6rem; }
  #footer .info .rules {margin: 0 -2rem;border-bottom: 1px solid rgba(150, 153, 160, 0.3);}
  #footer .info .rules > li {display: flex;flex-flow: row wrap;align-items: center;align-content: center;justify-content: center;height: 44px;}
  #footer .info .rules > li::after { display: none; }
  #footer .info .rules > li:last-child { border-left: 1px solid rgba(150, 153, 160, 0.3); }
  #footer .family-site { position: relative; top: inherit; left: inherit; right: inherit; margin: 15px auto 0; }
  #footer .family-site button {width: 100%; font-size: 1.6rem; }
  #footer .family-site .depth-list > li > a { font-size: 1.6rem; }
  #footer .info .copyright { padding: 0 15px; }
  
  .channel-title { margin-top: 30px; }
  .keyword { display: none; }
  .grid-wrap { min-height: inherit; position: relative; }
  .grid-wrap::after { background-color: #f5f6f7; content: ""; width: calc(100% + 30px); height: 100%; position: absolute; bottom: 0; left: -15px; z-index: -1; }
  .grid-wrap .btns { margin-top: 35px; }
  .grid-wrap .btns .btn { width: 98%; }
  .grid-wrap .grid .grid-item { width: 48%; }
  .grid-wrap .grid .grid-item > a .figcaption { padding: 10px; }
  #header .util li ~ li.eng{margin-top:.5rem;}
   }