
body { background:url(/img/main_bg.gif) repeat-x; }
#container { width:100%; margin-top:17px; overflow:hidden; }

#visual { width:100%; height:423px; }
#visual .movie { float:left; margin-left:2px; width:605px; height:410px; }
#visual .txt { float:left; margin:21px 0 0 29px; }

#quick { background:url(/img/quick_bg.gif) no-repeat; width:100%; height:73px; } 
#quick li { float:left; margin-top:25px; margin-left:69px; }
#quick li.title { margin:25px 100px 0 20px;}

*:first-child+html #visual { margin:6px 0; width:100%; height:423px; }

.content { clear:both; width:100%; overflow:hidden; }
.noticeBox { float:left; border:1px solid #edecec; width:312px; overflow:hidden; height:263px; }
.noticeBox .title { margin:35px 0 0 20px; height:15px; width:270px;  }
.noticeBox .title li { float:left; }
.noticeBox .title li.btn { float:right; margin-top:3px; }
.board { margin:25px 0 0 25px; width:260px; }
.serviceBox { width:330px; float:left;  height:265px; background:url(/img/serviceBox_bg.gif) no-repeat 190px 51px; }
.serviceBox h3 { margin:36px 0 0 27px; }
.serviceBox .list { margin:88px 0 0 27px; width:284px; }
.serviceBox .list li { float:left; margin:0 11px 9px 0; }
.telBox { float:left; width:314px; height:263px; border:1px solid #edecec; }
.telBox h3 { margin:35px 0 0 20px; }
.telInfo { margin-left:20px; }
.telInfo li.topBorder { background:url(/img/bank_topbd.gif) no-repeat top; padding-top:18px; margin-top:18px; }
.content2 { clear:both; width:100%; overflow:hidden; margin-top:5px; }
.bn01 { width:312px; height:127px; border:1px solid #edecec; float:left; background:url(/img/bn01_bg.gif) no-repeat 227px 21px; }
.bn01 dt { margin:26px 0 0 20px; }
.bn01 dd { margin:8px 0 0 20px; }
.bn02 { width:318px; height:127px; border:1px solid #edecec; float:left; background:url(/img/bn02_bg.gif) no-repeat 188px 31px; margin-left:5px;  }
.bn02 dt { margin:26px 0 0 20px; }
.bn02 dd { margin:8px 0 0 20px; }
.bn03 { width:314px; height:127px; border:1px solid #edecec; float:left; background:url(/img/bn03_bg.gif) no-repeat; margin-left:5px;  }
.bn03 dt { margin:26px 0 0 20px; }
.bn03 dd { margin:8px 0 0 20px; }


#footer { clear:both; margin-top:27px; width:100%; overflow:hidden; }

/*하단화면 추가*/


.serviceBoxN { border:1px solid #edecec; width:318px; margin:0 5px; float:left;  height:263px; background:url(/img/serviceBoxN_bg.gif) no-repeat right 14px; }
.serviceBoxN dt { width:140px; margin:92px 0 0 21px;  }
.serviceBoxN dd { width:140px; margin:8px 0 0 21px; }


.bn01_N { width:312px; height:127px; border:1px solid #edecec; float:left; }
.bn01_N dt { margin:26px 0 0 20px; }
.bn01_N dd { margin:10px 0 0 27px; }
.bn01_N dd p { float:left; margin:0 11px 5px 0; }
.bn02_N { width:318px; height:127px; border:1px solid #edecec; float:left; background:url(/img/logo_cpn.gif) no-repeat 143px 39px ; margin-left:5px;  }
.bn02_N dt { margin:26px 0 0 20px; }
.bn02_N dd { margin:8px 0 0 20px; }







.inner2 { width:95%; max-width:1200px; margin:0 auto; }
.containerwrap { background:#fff; }
.clearfix:after { content:""; display:block; clear:both; }
.clearfix {*zoom:1;}

.main_visual { position:relative; height:670px; background:url(/img/main_visual01.jpg) center center no-repeat; background-size:cover; text-align:center; } 
.main_visual .txtarea { position:absolute; top:50%; left:50%; display:inline-block; width:530px; padding:40px 10px; background:rgba(0,0,0,0.2); -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); transform:translate(-50%,-50%); }
.main_visual .txtarea p { color:#fff; text-align:center; text-shadow:1px 1px 7px rgba(0,0,0,0.6); line-height:1.2; }
.main_visual .txtarea .p01 { font-size:58px; font-weight:300; letter-spacing:-7px; margin-bottom:50px; }
.main_visual .txtarea .p02 { font-size:46px; font-weight:400; letter-spacing:-5px; }
.main_visual .txtarea .p03 { font-size:78px; font-weight:700; letter-spacing:-7px; }
@media screen and (max-width:1024px) {
.main_visual { height:600px; }
.main_visual .txtarea .p01 { font-size:47px; }
.main_visual .txtarea .p02 { font-size:43px; }
.main_visual .txtarea .p03 { font-size:70px; }
}
@media screen and (max-width:767px) {
.main_visual { height:530px; }
.main_visual .txtarea .p01 { font-size:37px; letter-spacing:-4px; }
.main_visual .txtarea .p01 img { width:85px; }
.main_visual .txtarea .p02 { font-size:33px; letter-spacing:-4px; }
.main_visual .txtarea .p03 { font-size:60px; }
}
@media screen and (max-width:600px) {
.main_visual .txtarea { width:80%; }
}
@media screen and (max-width:480px) {
.main_visual { height:400px; }
.main_visual .txtarea .p01 { font-size:27px; letter-spacing:-3px; margin-bottom:30px; }
.main_visual .txtarea .p01 img { width:70px; }
.main_visual .txtarea .p02 { font-size:25px; letter-spacing:-3px; }
.main_visual .txtarea .p03 { font-size:47px; letter-spacing:-6px; }
}
@media screen and (max-width:360px) {
.main_visual { height:330px; }
.main_visual .txtarea { padding:30px 10px; }
.main_visual .txtarea .p01 { font-size:24px; }
.main_visual .txtarea .p02 { font-size:23px; }
.main_visual .txtarea .p03 { font-size:40px; }
}


.section { margin-bottom:130px; text-align:center; }
.sect01 { margin-top:105px; }
.mn_txt_area { float:left; width:30.62%; }
.mn_txt_area h2 { text-align:right; padding-right:17%; }
.mn_txt_area h2 img {  }
.mn_txt_area .txtwrap { width:100%; padding:40px 11%; color:#fff; text-align:left; }
.mn_txt_area .txtwrap strong { display:block; font-size:32px; font-weight:500; margin-bottom:30px; letter-spacing:-3px; line-height:1.1; }
.mn_txt_area .txtwrap span { display:block; font-size:23px; font-weight:100; letter-spacing:-2.5px; line-height:1.3; word-break:keep-all; }
ul.mn_st_imglist { float:left; width:69.38%; }
ul.mn_st_imglist li { float:left; width:-webkit-calc(33.33% - 6.7px); width:-moz-calc(33.33% - 6.7px); width:calc(33.33% - 6.7px); margin:0 5px; }
ul.mn_st_imglist li:first-child { margin-left:0; }
ul.mn_st_imglist li:last-child { margin-right:0; }
ul.mn_st_imglist li img { width:100%; }
.sect01 .mn_txt_area .txtwrap { background:#53bfcd; }
.sect02 .mn_txt_area { float:right; }
.sect02 .mn_txt_area h2 { text-align:left; padding-left:17%; }
.sect02 .mn_txt_area .txtwrap { background:#e54868; }
.sect02 .mn_txt_area .txtwrap strong { letter-spacing:-1px; }
.sect02 .mn_txt_area .txtwrap .eng1 { letter-spacing:-1px; }
.sect03 .mn_txt_area .txtwrap { background:#365bb8; }
.sect03 ul.mn_st_imglist li { width:-webkit-calc(50% - 5px); width:-moz-calc(50% - 5px); width:calc(50% - 5px); }
@media screen and (max-width:1360px) {
.mn_txt_area h2 img { width:150px; }
.mn_txt_area .txtwrap strong { font-size:30px; }
.mn_txt_area .txtwrap span { font-size:20px; }
}
@media screen and (max-width:1250px) {
.mn_txt_area h2 img { width:130px; }
.mn_txt_area .txtwrap { padding:30px 11%; }
.mn_txt_area .txtwrap strong { font-size:26px; }
.mn_txt_area .txtwrap span { font-size:18px; letter-spacing:-2px; }
.sect02 .mn_txt_area .txtwrap strong { letter-spacing:0; }
.sect02 .mn_txt_area .txtwrap .eng1 { letter-spacing:0; }
}
@media screen and (max-width:1024px) {
.mn_txt_area, ul.mn_st_imglist { float:none; width:100%; }
.mn_txt_area { margin-bottom:10px; }
ul.mn_st_imglist {  }
}
@media screen and (max-width:768px) {
.section { margin-bottom:80px; }
.sect01 { margin-top:75px; }
}
@media screen and (max-width:768px) {
}
@media screen and (max-width:768px) {
}

.title001 { position:relative; font-size:47px; font-weight:500; color:#1b1b1b; padding:10px 10px 50px; margin-bottom:20px; letter-spacing:-3px; line-height:1.3; }
.title001:after { position:absolute; bottom:0; left:50%; content:''; width:1px; height:40px; background:#00a1e9; }
.title001 .small { position:relative; display:inline-block; font-size:24px; font-weight:300; color:#626262; letter-spacing:-2px; }
.title001 .small:before { position:absolute; top:-13px; left:-18px; content:''; width:13px; height:13px; background:#00a1e9; }
.title001 {  }
.subtit { font-size:18px; font-weight:300; color:#626262; margin-bottom:50px; letter-spacing:-2px; line-height:1.5; }
@media screen and (max-width:768px) {
.subtit { font-size:17px; padding:0 20px; word-break:keep-all; }
}
@media screen and (max-width:683px) {
.subtit {  }
.subtit .br01 { display:none; }
}
@media screen and (max-width:650px) {
.title001 { font-size:40px; }
.title001 .small { font-size:20px; }
.subtit { font-size:16px; }
}


.sect04 {  }
.sect04 ul { font-size:0; }
.sect04 ul li { display:inline-block; vertical-align:middle; width:16.66%; padding:0 14px; }
.sect04 ul li img { width:100%; }
@media screen and (max-width:1024px) {
.sect04 ul li { width:33.33%; padding:10px 14px; }
}
@media screen and (max-width:768px) {
.sect04 ul li { padding:10px 8px; }
}
@media screen and (max-width:480px) {
.sect04 ul li { width:50%; padding:10px 5px; }
}


.sect05 {  }
.sect05 ul {  }
.sect05 ul li {  }
.sect05 ul li img { width:100%; }
.sect05 ul li.forpc {  }
.sect05 ul li.formo { display:none; }
@media screen and (max-width:1024px) {
.sect05 ul li.forpc { display:none; }
.sect05 ul li.formo { display:block; }
}



.sect06 {  }
.sect06 ul { padding:0 20px; font-size:0; }
.sect06 ul li { display:inline-block; vertical-align:top; width:20%; padding:0 12px; }
.sect06 ul li img { width:100%; }
.sect06 ul li.formo { display:none; }
.sect06 ul li.li_d { padding-top:50px; }
@media screen and (max-width:1024px) {
.sect06 ul li { width:33.33%; padding:10px 12px; }
.sect06 ul li.formo { display:inline-block; }
.sect06 ul li.li_d { padding-top:10px; }
}
@media screen and (max-width:768px) {
.sect06 ul { padding:0; }
.sect06 ul li { padding:5px 5px; }
.sect06 ul li.li_d { padding-top:5px; }
}
@media screen and (max-width:480px) {
.sect06 ul li { width:50%; }
}



.sect07 { padding:60px 0 75px; background:url(../img/mn_shop_bg01.jpg) center center no-repeat; background-size:cover; color:#fff; margin-bottom:0; }
.sect07 .inner { width:92%; text-align:right; }
.sect07 h2 {  }
.sect07 h2 .tit11 { font-size:53px; font-weight:500; padding-bottom:5px; letter-spacing:-4px; line-height:1.3; }
.sect07 h2 .tit11 .small { font-size:43px; font-weight:300; }
.sect07 h2 .tit11 b { font-weight:500; }
.sect07 h2 .tit12 { display:inline-block; color:#ff6786; font-size:35px; padding-top:15px; border-top:1px solid rgba(255,255,255,0.8); font-weight:300; margin-bottom:10px; letter-spacing:-3px; }
.sect07 h2 .tit12 b { font-weight:500; }
.sect07 .detail { font-size:17px; font-weight:100; letter-spacing:-1.5px; line-height:1.7; margin-bottom:33px; }
.sect07 ul { margin-bottom:30px; }
.sect07 ul li { position:relative; display:inline-block; vertical-align:middle; width:120px; height:120px; border-radius:50%; border:1px solid #fff; font-size:16px; text-align:center; margin-left:20px; line-height:1.3; }
.sect07 ul li span { position:absolute; top:50%; left:0; display:block; width:100%; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%); transform:translateY(-50%); }
.sect07 .btn {  }
.sect07 .btn .go_shopping { display:inline-block; width:210px; background:#ff5578; border-radius:80px; text-align:center; padding:10px 0; font-size:19px; color:#111; font-weight:500; letter-spacing:-1.6px; }
@media screen and (max-width:1024px) {
.sect07 { padding:55px 0 60px; background:url(../img/mn_shop_bg01_mo.jpg) left center no-repeat; background-size:cover; color:#fff; margin-bottom:0; }
.sect07 h2 .tit11 { font-size:48px; }
.sect07 h2 .tit11 .small { font-size:38px; }
.sect07 h2 .tit12 { font-size:32px; }
.sect07 .detail { font-size:16px; }
.sect07 ul li { width:110px; height:110px; font-size:15px; }
.sect07 .btn .go_shopping { font-size:18px; }
}
@media screen and (max-width:768px) {
.sect07 h2 .tit11 { font-size:43px; }
.sect07 h2 .tit11 .small { font-size:33px; }
.sect07 h2 .tit12 { font-size:30px; }
.sect07 .detail { font-size:15px; }
.sect07 ul li { margin-left:10px; }
.sect07 .btn .go_shopping { font-size:17px; }
}
@media screen and (max-width:630px) {
.sect07 { background:url(../img/mn_shop_bg01_mo.jpg) center center no-repeat; background-size:cover; }
.sect07 h2 .tit11 { font-size:38px; }
.sect07 h2 .tit11 .small { font-size:28px; }
.sect07 h2 .tit12 { font-size:28px; }
.sect07 ul { //display:inline-block; //width:300px; width:100%; margin-bottom:20px; }
.sect07 ul li { width:47%; height:39px; border-radius:70px; font-size:14px; margin-left:0; margin-bottom:10px; }
.sect07 ul li br { display:none; }
}
@media screen and (max-width:480px) {
.sect07 { background:url(../img/mn_shop_bg01_mo.jpg) left -160px center no-repeat; background-size:cover; }
.sect07 .inner { padding-left:15%; }
.sect07 h2 .tit11 { font-size:33px; }
.sect07 h2 .tit11 .small { font-size:23px; letter-spacing:-2px; }
.sect07 h2 .tit12 { display:block; font-size:23px; letter-spacing:-2px; line-height:1.3; }
.sect07 h2 .tit12 b { display:block; font-size:1.2em; }
.sect07 .detail { font-size:14px; margin-bottom:23px; word-break:keep-all; }
.sect07 .detail br { display:none; }
.sect07 ul {  }
.sect07 ul li { width:100%; }
}
@media screen and (max-width:360px) {
.sect07 .inner { padding-left:8%; }
}
@media screen and (max-width:320px) {
.sect07 .inner { padding-left:0; }
}





