@charset "utf-8";

/* menu */
#menu {position:fixed; top:0; left:-180px; width:180px; height:100%; background:#f3f3f3; overflow:auto; z-index:10001;}
#menu .links {padding:8px 4px; background:#000;}
#menu .links ul:after {content:"";display:block;clear:both;}
#menu .links ul li {float:left; width:50%; padding:0 4px;}
#menu .links ul li a {display:block; color:#fff; font-size:12px; font-weight:700; background:#47a800; text-align:center; padding:5px;}
#menu .links ul li:first-child a {background:#910002;}
#menu .nav-menu>ul>li {border-bottom:solid 1px #ddd;}
#menu .nav-menu>ul>li>a {display:block; position:relative; padding:7px 20px; color:#000; font-size:14px; font-weight:700; line-height:22px;}
#menu .nav-menu>ul>li>a:hover {color:#910002;}
#menu .nav-menu2>ul>li {border-bottom:solid 1px #ddd;background:#cecece;}
#menu .nav-menu2>ul>li>a {display:block; position:relative; padding:7px 20px; color:#000; font-size:14px; font-weight:700; line-height:22px;}
#menu .nav-menu2>ul>li>a:hover {color:#910002;}
#menu .close {position:absolute; top:13px; right:15px; z-index:10;}
#menu .close img {width:16px;}
#menu-overlay {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:.7; z-index:1000;}

/* header */
.global {position:relative; background:#000;}

.util {padding:10px; text-align:center; color:#ccc; font-size:11px; line-height:18px;}
.util a:before {content:"|"; margin:0 7px 0 4px;}
.util a:first-child::before {display:none;}

.btn-menu {position:absolute; top:11px; left:12px;}
.btn-menu img {width:22px;}

.btn-search {position:absolute; top:10px; right:10px;}
.btn-search img {width:17px;}

.header {border-bottom:1px solid #333;}
.header .sitelogo {text-align:center;}
.header .sitelogo img {height:80px;}

.top-search {opacity:0; position:absolute; top:7px; right:0; padding:0; width:0; height:24px; background:#e8e8e8; overflow:hidden; transition: all 0.2s ease-in-out;}
.top-search input[type=search] {width:100%; height:24px; padding:3px 8px; font-size:12px; line-height:18px; border:0; vertical-align:top; outline:0; background:#e8e8e8;}
.top-search .btn {position:absolute; top:0; right:30px; width:40px; height:24px; color:#910002; border:0; outline:0; overflow:hidden; text-indent:-999em; background:#910002 url("../images/common/search_btn.png") 50% 50% no-repeat; background-size:auto 70%;}
.top-search .close {position:absolute; top:0; right:0; width:30px; height:24px; border:0; outline:0; overflow:hidden; text-indent:-999em; background:#212121 url("../images/common/close.png") 50% 50% no-repeat; background-size:auto 70%;}
.top-search.active {opacity:1; width:250px; padding:0 70px 0 0;}

.nav {background:#fff; overflow:hidden;}
.nav ul {display:grid; grid-template-columns:repeat(5, 1fr);}
.nav li {height:35px; text-align:center; border-bottom:1px solid #333; border-left:1px solid #333; }
.nav li a {display:flex; align-items:center; justify-content:center; width:100%; height:100%; color:#333; font-size:.8em; font-weight:700; line-height:1.15em;}
.nav li.active {background:#480001}
.nav li.active a {color:#ffcc00}
.nav li:nth-child(5n+1){border-left:0;}

/* main */
.visual-section {margin-bottom:10px;}
.visual-section .swiper-pagination-bullet {width:10px; height:10px; background:#fff; box-shadow:inset 1px 1px 1px rgba(0,0,0,.35); opacity:1; margin:0 3px !important;}
.visual-section .swiper-pagination-bullet-active {background:#333;}

.best-section {margin-bottom:40px;}
.best-section .head {position:relative; text-align:center; margin-bottom:15px;}
.best-section .head:after {content:"";position:absolute;top:48%;left:0;right:0;height:1px;background:#000;}
.best-section .head h2 {position:relative; display:inline-block; background:#fff; padding:0 10px; font-size:18px; color:#333; line-height:1.3em; z-index:2;}
.best-section .head h2 span {color:#000}
.best-section .tabs {display:table; width:100%; background:#e3e3e3; margin-bottom:25px;}
.best-section .tabs li {display:table-cell; width:20%; text-align:center; border-left:1px solid #c1c1c1;}
.best-section .tabs li:first-child {border-left:0;}
.best-section .tabs li a {display:block; padding:6px 0; font-size:11px; line-height:18px; font-weight:700; color:#333;}
.best-section .tabs li.active a {background:#cc0000;color:#fff;}
.best-section .tab-content {padding:0 15px;}
.best-section .more {margin:0 -15px;}
.best-section .more a {display:block; text-align:center; background:#eaeaea; color:#000; font-size:15px; font-weight:700; padding:7px;}

/* sub */
.sub-title {position:relative; padding:0 15px; background:#f4f4f4; border-bottom:1px solid #ddd; z-index:10;}
.sub-title h2 {color:#222; font-size:16px; line-height:40px;}

.lnb {border-bottom:1px solid #333;overflow:hidden;}
.lnb>ul {margin:0 -1px 0 0;}
.lnb>ul:after {content:"";display:block;clear:both;}
.lnb>ul>li {float:left; border-right:1px solid #ddd; text-align:center;}
.lnb>ul>li>a {display:block; padding:9px 5px; color:#333; font-size:12px; line-height:18px;}
.lnb>ul>li.active {border-color:#333}
.lnb>ul>li.active>a {color:#fff; font-weight:700; background:#333}
.lnb.col-2>ul>li{width:50%;}
.lnb.col-3>ul>li{width:33.33333333%;}
.real-cont {padding:20px 15px 30px;}

/* footer */
.foot-call {padding:0 15px 10px; text-align:center;}
.foot-call img {max-width:330px;}
.foot-sns {background:#000; text-align:center;}
.foot-sns a {margin:0 3%;}
.foot-sns img {height:38px;}
.foot-custom {padding:25px 10px; background:#333; color:#fff;}
.foot-custom:after {content:""; display:block; clear:both;}
.foot-custom .cs {float:left; width:53%; padding:0 5px; font-size:11px; line-height:16px;}
.foot-custom .bank {float:left; width:47%; padding:0 0 0 5px;}
.foot-custom .bank h3 {margin-bottom:10px;}
.foot-custom h3 {color:#fff; font-size:14px; margin-bottom:5px;}
.foot-custom .tel {color:#ffcc00; font-size:20px; font-weight:800; line-height:1.2em; margin-bottom:10px;}
.foot-custom .num {margin:8px 0; font-weight:800; font-size:17px;}
.foot-custom .txt {color:#66ccff; font-size:11px; font-weight:700; line-height:16px; padding-left:13px; text-indent:-13px;}
.foot-link {padding:10px 0; text-align:center; color:#484848; font-size:.75em; line-height:18px; border-bottom:1px solid #888;}
.foot-link a:before {content:"|"; margin:0 7px 0 4px;}
.foot-link a:first-child::before {display:none;}
.foot-info {padding:20px 15px; font-size:.77em; line-height:1.6em;}
.foot-info strong {color:#000;}
.foot-info .tel {color:#fd4d02;}