@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}

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

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

.flex-center {display: flex; justify-content: center; align-items: center;}

/* header */
#header {position:relative; background:#fff; border-bottom: 1px solid #dfdfdf; z-index:101;}
.header .contain {position:relative; height:100px;}

.sitelogo {position:absolute; top:50%; left:30px; margin-top: -35px; z-index:2;}
.sitelogo a {display: block;}

.gnb-wrap {position:relative; z-index:100; background: #011f5b;}
.gnb-wrap .contain {position:relative; z-index:10;}

.gnb-fixed #wrapper {padding-top:50px !important;}
.gnb-fixed .gnb-wrap {position:fixed; top:0; left:0; width:100%; z-index:100;}

#gnb {text-align:center; position: relative; z-index: 10;}
#gnb > ul {display:flex;}
#gnb > ul > li {flex:1;}
#gnb > ul > li > a {display:block; font-family: 'Noto Serif', serif; color:#fff; font-size:18px; font-weight: 600; line-height:60px; letter-spacing: -.04em;}
#gnb > ul > li > a span {position: relative;}
#gnb > ul > li > a span:after {content:''; position: absolute; bottom: -8px; left: 0; width: 100%; height: 3px; background-color: #fff; transform:scaleX(0); transition:.2s;}
#gnb > ul > li.active > a span:after {transform:scaleX(1);}
#gnb > ul > li.active > a {/* text-decoration: underline; text-underline-position:under; */}
#gnb .submenu {display:none; position:absolute; left:0; width: 100%; border-left: 1px solid #ddd;}
#gnb .submenu > ul {display:flex;}
#gnb .submenu > ul > li {flex:1; width: auto; padding: 30px 0; border-right: 1px solid #ddd;}
#gnb .submenu > ul > li > a {display:block; position:relative; font-size: 22px; color:#121212; font-weight: 700; line-height:1.65em; letter-spacing: -.04em;}
#gnb .submenu.ty2 > ul > li {padding: 15px 0;}
#gnb .submenu.ty2 > ul > li > a {font-size: 18px; font-weight: 500;}
#gnb .submenu > ul > li:hover {background-color: #fafafa;}
#gnb .submenu > ul > li:hover > a {color: #0066b2;}
#gnb .deck3 {margin-top: 10px;}
#gnb .deck3 > ul {}
#gnb .deck3 > ul > li {}
#gnb .deck3 > ul > li > a {display:block; position:relative; padding: 5px; color:#505050; font-weight: 300; line-height:1.4em; letter-spacing: -.04em;}
#gnb .deck3 > ul > li:hover > a {color: #0066b2; text-decoration: underline; text-underline-position:under;}

.submenu-bg {display:none; position:absolute; left:0; width:100%; height:0; background:#fff; border-bottom: 1px solid #ddd;}


.util {position: absolute; top: 50%; right: 30px; transform:translateY(-50%);}
.util ul {display: flex; margin: 0 -9px;}
.util ul li {padding: 0 9px;}
.util ul li a {position: relative; display: block; color: #878787; line-height: 1.5; letter-spacing: -.03em; padding-left: 45px; transition:none;}
.util ul li .ico {position: absolute; top: 50%; margin-top: -18px; left: 0; width: 36px; height: 36px; background-color: #fafafa; border: 1px solid #ddd; border-radius:100%; background-position:50% 50%; background-repeat:no-repeat; background-size:22px;}
.util ul li .ico-home {background-image:url("../images/common/ico_home.png");} 
.util ul li .ico-login {background-image:url("../images/common/ico_login.png");} 
.util ul li .ico-logout {background-image:url("../images/common/ico_logout.png");} 
.util ul li .ico-join {background-image:url("../images/common/ico_join.png");} 
.util ul li .ico-contact {background-image:url("../images/common/ico_contact.png");} 
.util ul li a:hover {color: #005bab; text-decoration: underline;}
.util ul li a:hover .ico {background-color: #005bab; border-color:#005bab;}
.util ul li a:hover .ico-home {background-image:url("../images/common/ico_home_on.png");} 
.util ul li a:hover .ico-login {background-image:url("../images/common/ico_login_on.png");} 
.util ul li a:hover .ico-logout {background-image:url("../images/common/ico_logout_on.png");} 
.util ul li a:hover .ico-join {background-image:url("../images/common/ico_join_on.png");} 
.util ul li a:hover .ico-contact {background-image:url("../images/common/ico_contact_on.png");} 

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

.mobile-navigation {position:fixed; top:0; right:0; width:250px; height:100%; overflow:auto; transition:.2s linear; -ms-transform:translateX(100%); transform:translateX(100%); background:#fff; z-index:102;}
.mobile-navigation .home {max-height:60px; padding: 19px 20px;}
.mobile-navigation .home a {display: block;  color: #000; font-size: 18px; font-weight: 700; line-height: 1.3em;}
.mobile-navigation .nav-menu>ul {border-top:1px solid #dfdfdf;}
.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:#2c2c2c; font-size:18px; font-weight:700; line-height:1.3em;}
.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 #454545; border-bottom:2px solid #454545;}
.mobile-navigation .nav-menu>ul>li.active>a:after {transform:translateY(-35%) rotate(-135deg); border-color:#011f5b;}
.mobile-navigation .nav-menu .submenu {display:none; background:#011f5b; padding: 10px 0;}
.mobile-navigation .nav-menu .submenu ul li a {display:block; padding:8px 20px; color:#fff; font-size:16px; line-height:1.3em;}
.mobile-navigation .nav-menu .submenu ul li a br {display: none;}
.mobile-navigation .nav-menu .deck3 {display: none !important;}
.mobile-overlay {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.6; z-index:101;}

.mobile-navigation .close {position:absolute; right:15px; top:18px; width:22px; height:22px;}
.mobile-navigation .close:before,
.mobile-navigation .close:after {position:absolute; left:11px; content:""; height:25px; width:2px; background-color:#333;transition-duration:0.3s, 0.3s; transition-delay:0.3s, 0s;}
.mobile-navigation .close:before {transform:rotate(90deg); transition-property:transform;}
.mobile-navigation .close:after {transform:rotate(-90deg); transition-property:transform;}


html.menu-opened {overflow:hidden;}
html.menu-opened .mobile-navigation {-ms-transform:translateX(0); transform:translateX(0);}
html.menu-opened .mobile-overlay {display:block;}
html.menu-opened .btn-m-menu span {background:none;}
html.menu-opened .btn-m-menu span:before,
html.menu-opened .btn-m-menu span:after {transition-delay:0s, 0.3s; background:#1191d0; height:2px;}
html.menu-opened .btn-m-menu span:before {top:0; transform:rotate(45deg);}
html.menu-opened .btn-m-menu span:after {bottom:2px; transform:rotate(-45deg);}
html.menu-opened .close:before {transform:rotate(45deg);}
html.menu-opened .close:after {transform:rotate(-45deg);}

/* main */
.main-visual {position:relative;}
.main-visual .contain {position: relative; height: 100%;}
.main-visual .item {height: 790px; background-position:50% 50%; background-repeat:no-repeat; background-size:cover;}
.main-visual .bg1 {background-image:url("../images/main/mv1.jpg");}
.main-visual .caption {position: absolute; top:50%; left: 0; transform:translateY(-50%); z-index:50; width:100%; color:#fff; text-align: center;}
.main-visual .caption h2 {font-size:58px; font-weight: 600; line-height:1.5em; letter-spacing: .05em;}
.main-visual .caption p {font-family: 'Noto Serif', serif; font-size: 18px; line-height:1.4em; letter-spacing: .15em; margin-top: 10px;}
.main-visual .caption .btn {display: inline-block; margin-top: 40px; margin-right: -.3em; font-family: 'Noto Serif', serif; font-size: 24px; line-height: 2.3em; letter-spacing: .1em;}
.main-visual .caption .btn span {position: relative; display: inline-block; transition:.2s;}
.main-visual .caption .btn em {font-style: normal; letter-spacing: .3em;}
.main-visual .caption .btn span:before,
.main-visual .caption .btn span:after {content:''; position: absolute; width: 0; height: 0; transition: filter .2s .1s;}
.main-visual .caption .btn span:before {top: 100%; left: -35px; border-top: 5px solid #fff; border-left: 160px solid transparent; transform-origin: center right; transform: scale(1) skewY(3deg);}
.main-visual .caption .btn span:after {top: 100%; right: -25px; border-top: 5px solid #fff; border-right: 160px solid transparent; transform-origin: center left; transform: scale(1) skewY(-3deg);}
.main-visual .caption .btn:hover span {text-shadow:rgba(0,0,0,.5) 0 0 5px;}
.main-visual .caption .btn span:before:hover ,
.main-visual .caption .btn span:after:hover {}
.main-visual .caption .btn:hover span:before {animation: triangle-left .4s; -webkit-animation: triangle-left .4s; filter: drop-shadow(0px 5px 5px rgba(0,0,0,.8));}
.main-visual .caption .btn:hover span:after {animation: triangle-right .4s; -webkit-animation: triangle-right .4s; filter: drop-shadow(0px 5px 5px rgba(0,0,0,.8));}

@-webkit-keyframes triangle-left
{
0% {transform: scale(0) skewY(3deg);}
100% {transform: scale(1) skewY(3deg);}
}

@-webkit-keyframes triangle-right
{
0% {transform: scale(0) skewY(-3deg);}
100% {transform: scale(1) skewY(-3deg);}
}

.m-head {font-family: 'Noto Serif', serif; color: #2c2c2c; font-size: 36px; line-height: 1.5; text-align: center; margin-bottom: 20px;}
.btn-view {display: inline-block; padding: 0 58px; color: #505050; line-height: 52px; border: 1px solid #ddd; background-color: #fafafa;}
.btn-view:hover {background-color: #0066b2; border:1px solid #0066b2; color: #fff;}

.main-links {padding-bottom: 55px;}
.main-links .box {position: relative; margin-top: -100px; padding: 5px;	background: linear-gradient(120deg, rgba(237,28,36,.7) 0%, rgba(0,102,178,.7) 100%);}
.main-links .box .inner {padding: 40px; background-color: #fff;}
.main-links ul {display: flex;flex-wrap:wrap; margin: -2.5px; text-align: center;}
.main-links ul li {width: 33.3333333%; padding: 2.5px;}
.main-links ul li a {position: relative; display: table; width: 100%; height: 527px; padding: 50px 15px; background-position:50% 50%; background-repeat:no-repeat; background-size:cover; overflow:hidden;}
.main-links ul li a:after {content:''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform:scaleX(0); background: linear-gradient(120deg, rgba(0,102,178,.8) 0%, rgba(237,28,36,.8) 100%); opacity: 0; transition:.5s;}
.main-links ul li a:hover:after {transform:scaleX(1); opacity: .52;}
.main-links ul li .background {position: absolute; display: block; top: 0; left: 0; right: 0; bottom: 0; transform:scale(1); transition:.5s;}
.main-links ul li .background.bg1 {background-image:url("../images/main/main_link1.jpg");}
.main-links ul li .background.bg2 {background-image:url("../images/main/main_link2.jpg");}
.main-links ul li .background.bg3 {background-image:url("../images/main/main_link3.jpg");}
.main-links ul li a:hover .background {transform:scale(1.1);}
.main-links ul li h3 {position: relative; display: table-cell; vertical-align: bottom; font-family: 'Noto Serif', serif; color: #fff; font-size: 28px; font-weight: 400; line-height: 1.4; z-index: 1;}

.main-notice {padding: 100px 0; margin-bottom: 120px; background-color: #fafafa;}
.main-notice .tab-menu {margin-bottom: 65px;}
.main-notice .tab-menu ul {display: flex;flex-wrap:wrap;justify-content: center; margin: -3px -22px;}
.main-notice .tab-menu ul li {position: relative; padding: 3px 22px;}
.main-notice .tab-menu ul li:after {content:''; position: absolute; top: 50%; right: -1px; margin-top: -9px; width: 1px; height: 18px; background-color: #a8a8a8;}
.main-notice .tab-menu ul li:last-child:after {display: none;}
.main-notice .tab-menu ul li a {color: #505050; font-size: 1.125em; line-height: 1.65; letter-spacing: -.04em;}
.main-notice .tab-menu ul li a:hover {color: #0066b2;}
.main-notice .tab-menu ul li.active a {color: #0066b2; font-weight: 700; text-decoration: underline; text-underline-position:under;}
.main-notice .list {}
.main-notice .list ul {display: flex; margin: -15px;}
.main-notice .list ul li {width: 33.3333333%; padding: 15px;}
.main-notice .list ul li a {position: relative; display: block; padding: 38px 40px 35px; background-color: #fff; height: 100%;}
.main-notice .list ul li a:after {content:''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border: 1px solid #ddd;}
.main-notice .list ul li a:hover:after {border-width: 2px; border-color:transparent; border-image: linear-gradient(120deg, rgba(237,28,36,.7) 0%, rgba(0,102,178,.7) 100%); border-image-slice: 1;}
.main-notice .list ul li .date {display: inline-block; text-align: center; color: #878787; font-size: 12px; font-weight: 300; line-height: 1.5; letter-spacing: -.03em; margin-bottom: 20px;}
.main-notice .list ul li .date strong {display: block; color: #505050; font-size: 36px; line-height: 1.1;}
.main-notice .list ul li .tit {color: #2c2c2c; font-size: 1.25em; line-height: 1.4; letter-spacing: -.03em; margin-bottom: 18px; overflow:hidden; text-overflow:ellipsis; word-break:break-all; white-space:nowrap;}
.main-notice .list ul li .txt {color: #878787; line-height: 1.625em; letter-spacing: -.03em; max-height:5.1em; 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 .list ul li .view {position: absolute; top: 50px; right: 40px; width: 22px; height: 22px;}
.main-notice .list ul li .view:before,
.main-notice .list ul li .view:after {content:''; position: absolute; background-color: #505050; transition:.2s;}
.main-notice .list ul li .view:before {width: 2px; height: 100%; top: 0; left: 50%; margin-left: -1px;}
.main-notice .list ul li .view:after {width: 100%; height: 2px; top: 50%; left: 0; margin-top: -1px;}
.main-notice .list ul li a:hover .view:before,
.main-notice .list ul li a:hover .view:after {background-color: #ed1c24; transform: rotate(180deg);}
.main-notice .list .buttons {margin: 60px 0 0;}

.main-partner {padding:30px 0; border-top: 1px solid #ddd;}
.main-partner .slider {position: relative; padding: 0 55px;}
.main-partner .slider li a {position: relative; display: block; padding-bottom: 35%;}
.main-partner .slider li img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:auto !important; height:auto !important; max-width:100%; max-height:100%; object-fit:contain;}
.main-partner .slide-btn {position:absolute; top:50%; z-index:51; border: 0; background-position:50% 50%; background-color:transparent; background-repeat:no-repeat; background-size: 18px; overflow:hidden; text-indent:-9999em;}
.main-partner .slide-btn {width:36px; height:36px; margin-top: -18px;}
.main-partner .slide-btn.prev {background-image:url("../images/main/partner_slide_prev.png"); left: 0;}
.main-partner .slide-btn.next {background-image:url("../images/main/partner_slide_next.png"); right: 0;}

/* sub */
#sub #container {max-width:1260px; padding-left:30px; padding-right:30px; padding-top: 50px; margin:0 auto; display: flex;}
#contArea {flex: 1 1 auto;min-width: 0;width: 1%;}
.real-cont {min-height:300px; padding-bottom:100px;}

.sub-visual {display:table; table-layout:fixed; width:100%; height:270px; overflow:hidden; margin-bottom: 50px; color:#fff; background-color:#eee; background-position:50% 50%; background-attachment:scroll; background-repeat:no-repeat; background-size:cover;}
.sub-visual .cell {display:table-cell; vertical-align:middle; padding:20px 60px;}
.sub-visual h3 {font-size:40px; font-weight: 600; line-height:1.5em; letter-spacing:-.03em;}
.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.bg4 {background-image:url("../images/common/sv4.jpg")}
.sub-visual.bg5 {background-image:url("../images/common/sv5.jpg")}
.sub-visual.bg6 {background-image:url("../images/common/sv6.jpg")}
.sub-visual.bg7 {background-image:url("../images/common/sv7.jpg")}
.sub-visual.bg8 {background-image:url("../images/common/sv8.jpg")}
.sub-visual.bg9 {background-image:url("../images/common/sv9.jpg")}
.sub-visual.bg10 {background-image:url("../images/common/sv10.jpg")}
.sub-visual.bg11 {background-image:url("../images/common/sv11.jpg")}
.sub-visual.bg12 {background-image:url("../images/common/sv12.jpg")}
.sub-visual.bg13 {background-image:url("../images/common/sv13.jpg")}
.sub-visual.bg14 {background-image:url("../images/common/sv14.jpg")}
.sub-visual.bg15 {background-image:url("../images/common/sv15.jpg")}
.sub-visual.bg16 {background-image:url("../images/common/sv16.jpg")}
.sub-visual.bg17 {background-image:url("../images/common/sv17.jpg")}
.sub-visual.bg18 {background-image:url("../images/common/sv18.jpg")}
.sub-visual.bg19 {background-image:url("../images/common/sv19.jpg")}
.sub-visual.bg20 {background-image:url("../images/common/sv20.jpg")}
.sub-visual.bg21 {background-image:url("../images/common/sv21.jpg")}
.sub-visual.bg22 {background-image:url("../images/common/sv22.jpg")}
.sub-visual.bg23 {background-image:url("../images/common/sv23.jpg")}
.sub-visual.bg24 {background-image:url("../images/common/sv24.jpg")}

.lnb {padding-bottom: 100px; width:220px; z-index: 10; word-break: break-word; margin-right: 60px;}
.lnb .tit {display: flex;justify-content: center;align-items: center; height: 110px; background: no-repeat url("../images/common/bg_lnb.jpg") 50% 50% / cover; font-family: 'Noto Serif', serif; font-size: 24px; font-weight: 400; color: #fff; line-height: 1.333em; padding: 10px; text-align: center;}
.lnb > ul {position: relative;}
.lnb > ul > li {width:auto; border: 1px solid #dfdfdf; border-top: 0;}
.lnb > ul > li > a {position:relative; display:block; padding: 22px 46px 22px 26px; line-height:1.5em; background: #fff; transition:none;}
.lnb > ul > li > a:hover {color:#0066b2;}
.lnb > ul > li.active > a {padding-left: 45px; color:#fff; background: #0066b2;}
.lnb > ul > li.active > a:before {content:''; position: absolute; top: 50%; left: 25px; margin-top: -5px; width: 0; height: 0; border-top: 5px solid transparent; border-left: 11px solid #fff; border-bottom: 5px solid transparent;}
.lnb .ico {position: absolute; top: 50%; right: 23px; margin-top: -7px; width: 14px; height: 14px;}
.lnb .ico:before,
.lnb .ico:after {content:''; position: absolute; background-color: #a8a8a8;  transition:.2s;}
.lnb .ico:before {width: 2px; height: 100%; top: 0; left: 50%; margin-left: -1px;}
.lnb .ico:after {width: 100%; height: 2px; top: 50%; left: 0; margin-top: -1px;}
.lnb .on .ico:before {transform:rotate(90deg);}
.lnb .active .ico:before,
.lnb .active .ico:after {background-color: #fff;}

.lnb .submenu {display: none; background: #fafafa; padding: 22px 10px 22px 34px;}
.lnb .active .submenu {display: block;}
.lnb .submenu > ul {}
.lnb .submenu > ul > li {position: relative; padding: 6px 0; padding-left: 12px;}
.lnb .submenu > ul > li:before {content:''; position: absolute; top: 19px; left: 0; width: 3px; height: 3px; background-color: #2c2c2c;}
.lnb .submenu > ul > li > a {color: #2c2c2c; font-size: 0.938em; line-height: 1.5; letter-spacing: -.04em;}
.lnb .submenu > ul > li.active:before {background-color: #0066b2;}
.lnb .active .submenu > ul > li.active > a {color: #0066b2;}

.lnb-m {display:none; position:relative; margin-top:-5px; margin-bottom:20px; z-index:50;}
.lnb-m .tit {display:block; position:relative; color:#fff; font-size:16px; font-weight:700; line-height:1.3em; padding:15px 40px 15px 16px; background:#0066b2;}
.lnb-m .tit:after {content:""; position:absolute; top:50%; right:20px; transform:translateY(-75%) rotate(45deg); width:12px; height:12px; border-right:2px solid #fff; border-bottom:2px solid #fff;}
.lnb-m > ul {display:none; position:absolute; left:0; width:100%; border:1px solid #dfdfdf; border-top:0; background:#fafafa;}
.lnb-m > ul > li {border-top:1px solid #dfdfdf;}
.lnb-m > ul > li.only-mobile {display:block !important;}
.lnb-m > ul > li:first-child {border-top:0;}
.lnb-m > ul > li > a {position: relative; display:block; padding:12px 15px; color:#2c2c2c; font-size:15px; font-weight:500; line-height:1.4em; letter-spacing:-.04em;}
.lnb-m > ul > li.active > a {color:#0066b2; font-weight:700;}
.lnb-m .ico {position: absolute; top: 50%; right: 23px; margin-top: -7px; width: 14px; height: 14px;}
.lnb-m .ico:before,
.lnb-m .ico:after {content:''; position: absolute; background-color: #a8a8a8; transition:.2s;}
.lnb-m .ico:before {width: 2px; height: 100%; top: 0; left: 50%; margin-left: -1px;}
.lnb-m .ico:after {width: 100%; height: 2px; top: 50%; left: 0; margin-top: -1px;}
.lnb-m .on .ico:before {transform:rotate(90deg);}
.lnb-m.active .tit:after {transform:translateY(-35%) rotate(-135deg);}

.lnb-m .submenu {display: none; background: #fff;}
.lnb-m .active .submenu {display: block;}
.lnb-m .submenu > ul {padding: 5px 0px; border-top: 1px solid #dfdfdf;}
.lnb-m .submenu > ul > li {padding: 0 15px;border-bottom: 1px solid #dfdfdf;}
.lnb-m .submenu > ul > li:last-child {border-bottom: 0;}
.lnb-m .submenu > ul > li > a {position: relative; display: block; color: #505050; padding: 5px 0;}
.lnb-m .submenu > ul > li.hasmenu > a:before {content:""; position:absolute; top:50%; right:0; transform:translateY(-75%) rotate(45deg); width:8px; height:8px; border-right:2px solid #505050; border-bottom:2px solid #505050;}
.lnb-m .active .submenu > ul > li.active > a {color: #0066b2;}

.sub-title {padding-bottom: 20px; margin-bottom: 60px;}
.sub-title h2 {font-size:32px; line-height:1.5em; letter-spacing:-.04em; margin-bottom: 20px;}
.sub-title .path {color:#878787; font-size:15px; line-height:1.4; letter-spacing: -.04em; margin-bottom: 22px;}
.sub-title .path .home {display:inline-block; vertical-align: middle; margin-top: -0.2em; padding-left:17px; background:no-repeat url("../images/common/home.png") 0 50% / contain; text-indent:-9999em; overflow:hidden;}
.sub-title .path .arrow {display:inline-block; text-align:left; margin:0 5px; width:10px; height:10px; overflow:hidden; text-indent:-999em; background:url("../images/common/path_arrow.png") 50% 50% no-repeat;}
.sub-title .path .current {color: #505050;}
.sub-title .line {width: 100%; height: 9px; background: no-repeat url("../images/common/line.png") center center / cover;}

/* footer */
#footer {padding: 40px 0 35px; background: #011f5b; color: #fff; font-weight: 200; line-height:1.625em; letter-spacing: -.03em;}
#footer .contain {display: flex;}
#footer address {font-style:normal;}

.foot-logo {width: 278px;}

.foot-links {margin-bottom: 18px;}
.foot-links ul {display:flex;margin: 0 -23px;}
.foot-links ul li {position: relative; padding: 0 23px;}
.foot-links ul li a {display:block;}

.foot-info {}
.foot-info address {}
.foot-info address span {display:inline-block; margin-right:16px;}
.foot-info .copyright {display: block; margin-right: 0; margin-top: 5px; font-family: 'Noto Serif', serif; font-size: 0.875em;}
.foot-info .copyright a {display: inline-block;}

.scroll-top {position:fixed; right:60px; bottom: 60px; width:76px; height:76px; z-index:101; color:#011f5b; font-size:14px; font-weight:700; line-height:1em; text-align:center; padding:22px 0; background:#fff; border:1px solid #dfdfdf;}
.scroll-top:before {content:""; display:block; width:0; height:0; margin:0 auto 7px; border-left:6px solid transparent; border-right:6px solid transparent; border-bottom:9px solid #011f5b;}