@charset "utf-8";


/* reset */
* { padding: 0px; margin: 0px;}
h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, p, table {margin: 0; padding: 0; list-style: none;}
header, main, footer, section, article, aside, nav {display: block;}
a {color: inherit; text-decoration: none;}
a img {border: none;}
ul, dl,dt,dd {list-style: none;}
body,input,textarea,select,button,table{ font-family: "Noto Sans KR", 'Nanum Gothic', '돋움', sans-serif;  font-size: 14px; font-weight: 300; line-height: 26px; color: #333;} /*기본폰트설정*/

body { padding-top: 125px}


/* 탑버튼 */
.return-top { right:20px; bottom:20px; position:fixed; z-index:90; width:50px; line-height:50px; background:#333; font-size:14px; font-weight:500; text-align:center; color:#FFF !important; border-radius:30px }
.return-top:hover { background:#666; transition:all 1s}


.inner { position:relative; width:1200px; margin:0 auto;}
.inner:after { display:block; content:""; clear:both}


/* 헤더 */
#header { position:fixed; top:0; left:0; right:0; background:#fff; z-index:1000; width:100%; min-width:1200px; height:125px; border-bottom:solid 1px #f2f2f2}
#header .h_top { height:80px; border-bottom:solid 1px #f2f2f2}
#header .h_top .logo { padding: 18px 0 0 10px; text-align:center}
#header .h_top .top_call { position:absolute; top:30px; right:20px; font-size:18px; font-weight:500}
#header .h_top .top_call img { padding-right:10px; margin-bottom:-7px; vertical-align:top !important}


#header .gnb { line-height:45px;}
#header .topmenu {}
#header .topmenu ul{ height:45px; width:940px; margin:0 auto;}
#header .topmenu li{ float:left; position:relative;}
#header .topmenu li a{ color:#333; display:block; line-height:45px; padding:0px 45px;font-size:18px; font-weight:400;}
#header .topmenu li a:hover, .topmenu ul li:hover a{ color:#ec1d23; }
#header .topmenu li ul{ display:none; background: rgb(109,109,109); height:auto; position:absolute; width:180px; z-index:200; left:-10px; top:45px}
#header .topmenu li:hover ul{ display:block; }
#header .topmenu li li { background: rgb(109,109,109); display:block; float:none; margin:0px; padding:0px; width:180px; border-bottom:solid 1px #999; }
#header .topmenu li li:last-child { border:none}
#header .topmenu li:hover li a{ background:none; }
#header .topmenu li ul a{ display:block; height:40px; line-height:40px; font-size:13px; font-weight:400; padding:0 10px; text-align:center; color:#fff !important; }
#header .topmenu li ul a:hover{ background:#ec1d23; transition: all 0.15s ease-in;}




/* 메인비주얼 */
.main_visual { width:100%; min-width:1200px; height:610px; background:url(../images/main/main_visual.png) no-repeat;}
.main_visual .txt { padding-top:130px; margin:0 auto; text-align:center; text-shadow:2px 2px 2px rgba(0,0,0,0.5)}
.main_visual .txt h3{ margin-bottom:50px; font-size:70px; color:#fff;}
.main_visual .txt p { font-size:35px; font-weight:600; line-height:60px; color:#fff;}



/* 메인- 콘텐츠01 */
.main_con01 { width:100%; margin:50px 0; height:200px;}
.main_con01 ul {}
.main_con01 ul li { text-align:center; margin:0 15px; width:568px; height:200px; border:1px solid #ccc }
.main_con01 ul li.bn01 {float:left;}
.main_con01 ul li.bn02 {float:right;}
.main_con01 ul li > a { display:block; height:100%}
.main_con01 ul li .text{ margin-top:30px}
.main_con01 ul li .text p.tit {padding-top:20px;font-size:25px; font-weight:400;}
.main_con01 ul li:hover{border-color:red; margin-top:-20px; transform:translate(0.4)}


/*배너슬라이드*/
.slid_area{ background:#f7f7f1}

/* 메인- 콘텐츠02 */
.main_con02 {margin:100px 0 50px 0; width:100%; min-width:1200px; height:470px; background:url(../images/main/main_bgimg.png) no-repeat;}
.main_con02 .main_sqtxt{ margin-top:30px; float:right; background:#eeeeee; width:1100px; height:450px; box-sizing:border-box; padding:50px}
.main_con02 .main_sqtxt .sq_title{ color:red; font-size:30px; font-weight:bold;}
.main_con02 .main_sqtxt .store{ color:blue; font-size:27px; font-weight:bold; text-align:center}
.main_con02 .main_sqtxt img{margin-right:20px}
.main_con02 .main_sqtxt > p{ margin:30px 0;font-size:25px}

/* 메인- 콘텐츠03 */
.main_con03 { width:100%; margin:100px 0; height:460px}
.main_con03 .con_left { position:absolute; left:0;}
.main_con03 .con_left h2 { font-size:32px; font-weight:600; line-height:45px; color:red}
.main_con03 .con_left p { font-size:16px; font-weight:500; line-height:32px; color:#424242}
/*.main_con03 .con_left img { padding-left:20px}*/
.main_con03 .con_right { position:absolute; left:56%; /*top:20px*/}
.main_con03 .con_right h2 { font-size:32px; font-weight:600; line-height:45px; color:red}
.main_con03 .con_right p { font-size:16px; font-weight:500; line-height:32px; color:#424242}
.main_con03 .con_right .call_info { padding:30px 0}
.main_con03 .con_right .call_info ul li { font-size:40px; font-weight:bold; /*color:#686868; border-bottom:dotted 2px #dcdcdc; line-height:60px*/}
.main_con03 .con_right .call_info ul li.add { font-size:21px; letter-spacing:-0.5px}
.main_con03 .con_right .btn { padding-top:30px}
.main_con03 .con_right .btn a { padding:10px 70px; border:solid 3px #154286; color:#154286; font-size:26px; font-weight:500}
.main_con03 .con_right .btn a:hover { background-color:#154286; color:#fff; transition: all .4s ease}



/* 푸터 */
#footer { position:relative; width:100%; height:155px; border-top:1px solid #ccc}
.foot_nav { background-color:#eeeeee; line-height:40px; min-width:1200px}
.foot_nav ul { text-align:center}
.foot_nav ul li { display:inline-block;}
.foot_nav ul li:after { display:inline-block; content:"｜"; padding:0 20px; font-size:10px }
.foot_nav ul li:last-child:after { display:none}
.foot_nav ul li a { font-size:14px}

.copyright { height:115px;}
.copyright h1.foot_logo img { float:left; padding:35px 100px 0 20px;}
.copyright .txt { padding-top:20px}
.copyright .txt p { font-size:13px}
.copyright .txt p span { padding-left:20px}




/* 서브비주얼 */
.sub_visual { position:relative; width:100%; min-width:1200px; height:260px}
.sub_visual .txt { padding-top:80px; margin:0 auto; text-align:center; text-shadow:2px 2px 2px rgba(0,0,0,0.5)}
.sub_visual .txt p { font-size:28px; font-weight:500; line-height:40px; color:#fff;}
.sv_bg01 { background:url(../images/sub/sub_visual01.png) no-repeat}
.sv_bg02 { background:url(../images/sub/sub_visual02.png) no-repeat}
.sv_bg03 { background:url(../images/sub/sub_visual03.png) no-repeat}
.sv_bg04 { background:url(../images/sub/sub_visual04.png) no-repeat}
.sv_bg05 { background:url(../images/sub/sub_visual05.png) no-repeat}



/* 서브페이지 - 레이아웃 */
.container { position:relative; width:100%; margin-bottom:80px;}

.container .left_area { float:left; left:0; top:20px; width:220px; overflow:hidden;box-sizing:border-box; }
.container .left_area .title { display:block; width:220px; height:120px; }
.container .left_area .title h2 { font-size:30px; font-weight:500; line-height:40px;}
.container .left_area .title p  { font-size:15px; font-weight:400; padding-top:30px; color:#666 }
.container .left_area .left_menu {}
.container .left_area .left_menu li a { display:block; font-size:16px; font-weight:400; line-height:40px; border-bottom:solid 1px #ddd; padding-left:15px}
.container .left_area .left_menu li a:hover { padding-left:18px; /*background-color:#f6f6f6;*/ background:url(../images/sub/left_menu_arr.png) no-repeat 92% center; color:#ec1d23; transition:color .4s }
.container .left_area .left_menu li.active a {color:#fff; background-color:#ec1d23}

.container .right_area { float:right; right:0; top:20px; width:900px; margin-top:30px}
.container .right_area > h2 {font-size:24px; font-weight:400; line-height:50px; border-bottom:solid 1px #ddd; margin-bottom:50px}
.container .right_area > h2 span { padding-left:10px; font-size:20px; color:#154286}
.container .right_area > h2:before { display:inline-block; content:""; width:5px; height:20px; background-color:#ec1d23; margin-right:10px}


/*인사말*/
.hello { font-size:30px; font-weight:500; line-height:45px; margin-bottom:30px}
.greeting { background:url(../images/sub/sub1_img01.png) no-repeat right 0}
.greeting p { font-size:16px; line-height:28px; padding-bottom:20px; width:500px; word-break:keep-all}
.greeting p span { font-weight:400; font-size:18px; float:right}


/*스토리*/
.con_history img{ width:100%}

/*오시는길*/
/*.map { float:left; left:0; width:500px}*/
.map_info { text-align:center}
.map_info li { font-size:16px; line-height:40px; display:inline-block}

/*가맹점*/
.container .right_area .tabel_area table{ margin:0 auto; text-align:center; border:1px solid #ccc; border-collapse:collapse}
.container .right_area .tabel_area table tr{ border:1px solid #ccc}
.container .right_area .tabel_area table th{ border:1px solid #ccc; padding:0 10px; background:#6787D1; color:#fff}
.container .right_area .tabel_area table td{ border:1px solid #ccc; padding:20px 10px}
.container .right_area .tabel_area table img{ width:30px}


/*협력업체*/
.container .right_area .com_con ul { border:1px solid #ccc; margin-bottom:20px}
.container .right_area .com_con ul h2 { color:#fff; background:#ec1d23; padding:10px 0; text-align:center}
.container .right_area .com_con ul h2.txt_margin{ margin-bottom:30px;}
.container .right_area .com_con ul li { margin-bottom:30px; /*display:inline-block; text-align:center;*/ width:250px; margin-left:20px; margin-top:20px}
.container .right_area .com_con ul li.dis { display:inline-block; width:400px}
.container .right_area .com_con ul li > ul { border:none}


.pro_list { }
.pro_list ul li { display:inline-block; margin: 0 16px 40px}
.pro_list ul li .img_area { border:solid 1px #ddd; overflow:hidden; box-sizing:border-box; text-align:center}
.pro_list ul li .img_area img { width:260px; height:197px}
.pro_list ul li p { font-size:16px; font-weight:400; line-height:30px; text-align:center}
.pro_list ul li:hover p { color:#ec1d23}
.pro_list ul li:hover .img_area img { transform:scale(1.1); transition:all 0.6s}



.pro_info { padding-bottom:60px; border-bottom: dotted 2px #ddd}
.pro_img { display:inline-block; left:0; width:400px; text-align:left}
.pro_txt { float:right; right:0; width:400px; margin-top:20px; padding:20px 30px; background:#f6f6f6}
.pro_txt h3 { font-size:26px; font-weight:500; line-height:50px; border-bottom:solid 1px #ddd}
.pro_txt p { font-size:16px; line-height:26px; margin-bottom:50px}
.pro_txt .down_btn a { display:block; width:180px; line-height:40px; text-align:center; background:#d2080e; color:#fff; font-weight:400}
.pro_txt .down_btn a:hover {background:#333; transition:all .4s ease-in-out }
.pro_txt .down_btn a img { padding-right:7px}

.pro_detail { padding-top:50px; text-align:center }
.pro_detail .detail_img { margin-bottom:100px}
.pro_detail .back_btn { text-align:center}
.pro_detail .back_btn a { font-size:14px; font-weight:400; color:#fff; background:#333; display:block; width:100px; line-height:35px;}
.pro_detail .back_btn a:hover { opacity:0.9}


.sub_tab { margin-bottom:60px; text-align:center}
.sub_tab ul li { display:inline-block; width:19%; line-height:40px; text-align:center; border:solid 1px #ddd; cursor:pointer}
.sub_tab ul li a { font-size:16px; font-weight:400;}
.sub_tab ul li.active { background:#154286; color:#fff}
.sub_tab ul li:hover {background:#154286; color:#fff}