@charset "utf-8";
@font-face{
    font-family:nanumSqure;
    font-weight:400;
    src:url('./fonts/NanumSquareR.ttf');
}
@font-face {
    font-family:nanumSqure;
    font-weight:800;
    src: url('./fonts/NanumSquareB.ttf');
}

@font-face {
    font-family:"Helvetica LT Std";
    font-weight:600;
    src: url('./fonts/HelveticaLTStd-BlkCond.otf'),
		url(./fonts/HelveticaLTStd-BlkCond.ttf) format('truetype');
}

@font-face {
    font-family:Helvetica;
    font-weight:600;
    src: url('./fonts/HelveticaLTStd-BlkCond.otf'),
		url(./fonts/HelveticaLTStd-BlkCond.ttf) format('truetype');
}




@font-face {
 font-family: nanumSqure;
 font-weight: 400;
 src:url('./fonts/NanumSquareR.ttf'),
        local(NanumSquareR), /* 두번째 */
       url(NanumSquareR.eot) format('embedded-opentype'),
       url(NanumSquareR.woff) format('woff'), /* 세번째 */
       url(NanumSquareR.ttf) format('truetype'); /* 네번째 */
}
@font-face {
 font-family: nanumSqure;
 font-weight: 600;
 src:url('./fonts/NanumSquareB.ttf') ,
        local(NanumSquareB), /* 두번째 */
       url(NanumSquareB.eot) format('embedded-opentype'),
       url(NanumSquareB.woff) format('woff'), /* 세번째 */
       url(NanumSquareB.ttf) format('truetype'); /* 네번째 */
}
@font-face {
 font-family: nanumSqure;
 font-weight: 800;
 src:url('./fonts/NanumSquareEB.ttf'),
        local(NanumSquareEB), /* 두번째 */
       url(NanumSquareEB.eot) format('embedded-opentype'),
       url(NanumSquareEB.woff) format('woff'), /* 세번째 */
       url(NanumSquareEB.ttf) format('truetype'); /* 네번째 */
}
@font-face {
 font-family: nanumSqure;
 font-weight: 300;
 src:url('./fonts/NanumSquareL.ttf'),
        local(NanumSquareL), /* 두번째 */
       url(NanumSquareL.eot) format('embedded-opentype'),
       url(NanumSquareL.woff) format('woff'), /* 세번째 */
       url(NanumSquareL.ttf) format('truetype'); /* 네번째 */


}


@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700');




/* CSS Document */
a, abbr, acronym, address, applet, article, aside, audio,
b, blockquote, big, body,
center, canvas, caption, cite, code, command,
datalist, dd, del, details, dfn, dl, div, dt, 
em, embed,
fieldset, figcaption, figure, font, footer, form, 
h1, h2, h3, h4, h5, h6, header, hgroup, html,
i, iframe, img, ins,
kbd, 
keygen,
label, legend, li, 
meter,
nav,
object, ol, output,
p, pre, progress,
q, 
s, samp, section, small, span, source, strike, strong, sub, sup,
table, tbody, tfoot, thead, th, tr, tdvideo, tt,
u, ul, 
var{ background: transparent; border: 0 none; font-size: 100%; margin: 0; padding: 0; vertical-align: baseline; }
html, body {height:100%; -webkit-text-adjust:none;}
body { -webkit-text-adjust:none; min-width:1280px; padding:0; margin:0;font-family:nanumSqure,'KoPub Dotum', 나눔고딕, AppleSDGothicNeo, sans-serif; color:#444; text-align:center; font-size:18px; line-height:24px; /*background-image:url(images/ptn_body.png); background-repeat:repeat;*/}
img {display:block; border:none; }
*::-moz-selection {background-color: #ffbf12; color: #fff;}
*::selection {background-color: #ffbf12; color: #fff;}
a {text-decoration:none; }
a:active {border:none; outline:none;}
.clear {clear:both;}
.float-right {float:right;}
.tc-fff {color:#fff;}
.ts-11 {font-size:11px;}

/*버튼*/
button.btn_common{border-radius:3px; text-align:center;}
button.btn_common.blue{background:#2196f3; color:#fff;}
button.btn_common.gray{background:#e6e6e6; color:#1a1a1a;}

.btn_all { width:200px; margin:50px auto  }
.btn_all a { margin:10px; display:block }
.btn_box { text-align:center; display:block; width:100%; height:1.7em; line-height:1.7em; background:#2196f3; color:#fff; border-radius:0 0 3px 3px; } 

.blue{ color:#3862b7 }    /*일반-파란색*/
.marine { color:#303f9f }    /*일반- 군청색*/
.red{ color:#d82126;} 
.error{ color:#d82126; }   /*오류-빨간색*/
.warning{ color:#e7946c;}  /*경고-살구색*/
.caution{ color:#12851f; }   /*주의-녹색 */
.gray{ color:#6b6b6b }  /*회색*/

.bg_blue{ background:#3862b7 }    /*일반-파란색*/
.bg_marine { background:#303f9f }    /*일반- 군청색*/
.bg_red{ background:#d82126  }
.bg_error{ background:#d82126  }   /*오류-빨간색*/
.bg_warning{ background:#e7946c }  /*경고-살구색*/
.bg_caution{ background:#56b245  }   /*주의-녹색 */
.bg_gray{ background:#6b6b6b }  /*회색*/


body, input, textarea, select, button, table, h1, h2, h3, h4{ font-family:nanumSqure,'KoPub Dotum', 나눔고딕, AppleSDGothicNeo, sans-serif;}

.mint { color:#35abc0 }


.all-free {width:110px; height:100px; position:fixed; z-index:9999; top:0; right:0;}
.nav-wrap {width:100%; height:100px; min-width:1200px; padding:0; text-align:left; z-index:999;  position:fixed; top:0 }


.nav-wrap .nav { max-width:1200px;  margin:0 auto; opacity: 1;transition: all 0.3s; height:100px; }
.nav-wrap .nav .logo a { width:271px; height:31px; float:left; padding:0; margin:22px 0 0 0; background-image:url(images/logo_w.png); background-size:100% 100%; background-repeat:no-repeat; text-indent:9999px; background-position:left top;}

.nav-wrap .nav ul.mainmenu {  list-style:none; float:left; margin:35px 0 0 65px; padding:0; }
.nav-wrap .nav ul.mainmenu li {display:inline-block; padding:0 0 0 0;}
.nav-wrap .nav ul.mainmenu li a {color:#000; font-size:18px; font-weight:600; letter-spacing:-0.01em; text-decoration:none; /*text-transform:uppercase;*/   padding:4px 10px 7px 10px; margin:0 20px;  color:#ffffff;  }
.nav-wrap .nav ul.mainmenu li a:visited {}
.nav-wrap .nav ul.mainmenu li a:hover   {color:#ffffff; text-decoration:none;  background-color:#2b88fa; text-shadow:none; border-radius: 30px; }
.nav-wrap .nav ul.mainmenu li a.checked  {color:#ffffff; text-decoration:none;  background-color:#2b88fa; text-shadow:none; border-radius: 30px; }
.nav-wrap .nav ul.mainmenu li a:active  {color:#ffffff; text-decoration:none;  background-color:#2b88fa; text-shadow:none; border-radius: 30px; }
.nav-wrap .nav ul.mainmenu li.f-right {float:right; padding-right:0; padding-left:10px; margin-top:-7px}
.nav-wrap .nav .smenu { list-style:none; float:right; position:relative; margin:28px 20px 0 0; }
.nav-wrap .nav .smenu a{ display: inline-block;}
.nav-wrap .nav .smenu span { }
.nav-wrap .nav .smenu a:link { color:#fff; font-size:15px; line-height:32px; padding:4px 15px; outline:none; cursor:pointer;  }
.nav-wrap .nav .smenu a:hover { color: #21b8d8; text-decoration: none}
.nav-wrap .nav .smenu a:active {}
.nav-wrap .nav .smenu a:visited {color:#fff;}
.nav-wrap .nav .smenu a.language { color:#fff; border:0; text-shadow:0 0 4px rgba(0,0,0,0.9); }
.nav-wrap .nav .smenu a.language img { display:inline-block;  vertical-align:top }
.nav-wrap .nav .smenu a.language:hover { color:#fff;}
.nav-wrap .nav .smenu a.link_text {  background-color:#fff; border:#f1f1f1 solid 1px; border-radius:30px;  color:#000; font-size:16px; line-height:20px; padding:3px 10px; margin-top:13px; }


.nav-scroll {background-color:#fff; border-bottom:1px #e6e6e6 solid; position:fixed; z-index:999;  opacity: 1;transition: all 0.3s; height:60px;}
.nav-scroll .nav { height:60px; }
.nav-scroll .nav .logo a {  float:left; padding:0; margin:14px 0 0 0; background-image:url(images/logo.png); background-size:100% 100%; background-repeat:no-repeat; text-indent:9999px;background-position:left top;}
.nav-scroll .nav .smenu { list-style:none; float:right; position:relative;  }
.nav-scroll .nav ul.mainmenu {  list-style:none; float:left; margin:20px 0 0 94px; padding:0;}
.nav-scroll .nav ul.mainmenu li {display:inline-block; padding:0 0 0 0;}
.nav-scroll .nav ul.mainmenu li a {  }
.nav-scroll .nav ul.mainmenu li a:visited {}
.nav-scroll .nav ul.mainmenu li a:hover   {color:#ffffff; text-decoration:none;  background-color:#2b88fa; text-shadow:none; border-radius: 30px; }
.nav-scroll .nav ul.mainmenu li a.checked   {color:#ffffff; text-decoration:none;  background-color:#2b88fa; text-shadow:none; border-radius: 30px; }
.nav-scroll .nav ul.mainmenu li a:active  {color:#ffffff; text-decoration:none;  background-color:#2b88fa; text-shadow:none; border-radius: 30px; }
.nav-scroll .nav ul.mainmenu li.f-right {float:right; padding-right:0; padding-left:10px; margin-top:-7px}
.nav-scroll .nav .smenu{ list-style:none; float:right; position:relative; margin:11px 20px 0 0; }
.nav-scroll .nav .smenu a {}
.nav-scroll .nav .smenu a.selected { color:#000;}
.nav-scroll .nav .smenu span { }
.nav-scroll .nav .smenu a:link { color:#000; }
.nav-scroll .nav .smenu a:hover { color: #21b8d8; }
.nav-scroll .nav .smenu a:active {  }
.nav-scroll .nav .smenu a:visited { color:#000; }
.nav-scroll .nav .smenu a.language { color:#000; border:0; text-shadow:none}
.nav-scroll .nav .smenu a.language img { display:inline-block;  vertical-align:top }
.nav-scroll .nav .smenu a.language:hover { color:#000;}
.nav-scroll .nav .smenu a.link_text {  background-color:#000; border:#f1f1f1 solid 1px; border-radius:30px;  color:#000; font-size:16px; line-height:20px; font-weight:600; padding:3px 10px; margin-top:13px; }



.nav_all { display:none }
.menu_all { display:none }
.nav_smenu { display:none }


.center_img { width:100%; height:240px; background-color:#efeeea; margin:0 auto; text-align:center }
.center_img img { margin:0 auto; text-align:center }

.visual {width:100%; height:670px; margin:auto; position:relative; z-index:1;  }
.visual .ptn { width:100%; height:100%; position:absolute; top:80px; left:0; background-image:url(images/img_main.jpg); background-repeat:repeat; background-size:1900px 670px; background-position:50% 0%; z-index:2;  }
.visual .visual-text-wrap { position:relative; margin:auto; width:100%}
.visual .visual-text-wrap button { background-color:#f7c000;  color:#fff; border-radius:5px; font-size:26px; font-weight:400; padding:1% 3%; outline:none; cursor:pointer; margin-top:0.3%; border:0; box-shadow:2px 2px 4px rgba(0,0,0,0.3);}
.visual .visual-text-wrap button:hover { background-color:#f79700; }
.visual .visual-text-wrap .visual-text {z-index:3; position:absolute; width:100%; margin:0 auto; text-align:center; font-weight:700; color:#fff; line-height:1.5em; }
.visual .visual-text-wrap .visual-text h1 { margin:200px auto 0; font-size:72px; height:140px; color:#ffffff; font-weight:100;  text-shadow:0 0 4px rgba(0,0,0,0.9); letter-spacing:-0.03em;/* font-style: italic;*/ }
.visual .visual-text-wrap .visual-text h1 span { display:block; font-size:30px; color:#ffffff; font-weight:400; background-color:#2daac0; padding:5px; }
.visual .visual-text-wrap .visual-text h2 { max-width:540px;  margin:30px auto 0; text-align:center; font-size:22px; color:#ffffff; font-weight:400; background-color: rgba(0,0,0,0.6); padding:5px 20px 2px; }
.visual .visual-text-wrap .visual-text h2 strong { font-size:22px; font-style:italic;}
.visual .visual-text-wrap .visual-text h3 { margin:25px auto; text-align:center; font-size:18px; color:#ffe5ca; font-weight:400; padding:8px 20px 5px;  text-shadow:0 0 4px rgba(0,0,0,0.9); letter-spacing:-0.05em}
.visual .visual-text-wrap .visual-text h3 img { display:block; width:320px; text-align:center;  margin:0 auto 35px; }

.bottom_down { display:block; margin:0; padding:0  }
.bottom_down img { display:inline-block}

h1 {font-size:60px; color:#000; line-height:1.0em; padding:0; margin:0 auto; font-weight:500; letter-spacing:-0.03em}
h1 span { letter-spacing:-0.01em}
h2 {font-size:21px; color:#7f5e25; line-height:24px; padding:20px 0 0 0; margin:0; font-weight:400;}
h3 {font-size:18px; padding:0; margin:50px auto 30px; text-align:center;}
h4 {font-size:16px; color:#fff; padding:0; margin:0; font-weight:700;}

.overview, .features, .shop, .support, .overview_top { width:100%; margin:0 auto; text-align:center; }

.overview_top  { display:block; margin:0 auto; height:715px;  background:url("images/img_01.jpg") no-repeat 50% 0;  background-size:1920px 920px; padding-top: 195px}
.overview_top  h1 { width: 900px; margin: 0 auto 0; color: #fff; font-size: 60px; font-weight: 600; border:#a9cde9 solid 1px; border-radius: 2em; padding:10px 0 }
.overview_top  h3 { color: #fff; font-size: 24px; font-weight: 400; }
.overview_top  h4 { margin: 0 auto 0; color: #fff; font-size:18px; font-weight: 400; }
.overview_top  h4 strong { color:#7aedff; font-size:18px; font-weight: 400; }
.overview_top a { display:block;  margin: 0 auto; text-align: center; padding-top: 5%;color: #fff;  font-size: 60px; font-weight: 800; vertical-align: middle }
.overview_top a:hover { text-decoration: none; color:#7aedff; }
.overview_top a img { display: inline-block ;  vertical-align: middle; padding-right: 18px; }
.overview_top .img_text_3rd {   display:block;  margin: 0 auto; text-align: center;  padding-top: 5%;}


.overview{ display:block; padding:0; height: 851px;  background:url("images/img_macbook.png") no-repeat center 220px;  background-size:1842px auto;  }
.overview h1 { display:block; font-size:72px; color:#000; margin-bottom:80px; } 
.overview h1 span { display:block; font-size:24px; color:#747474; margin-bottom:80px;} 
.overview p { display:block; width:100%; margin:0 auto; font-size:18px; padding:10px 0; letter-spacing:-0.05em; color:#fff; background-color:#414141;}
.overview img { width:100%; margin:0 auto 20px;}
.overview  h2 { margin: 80px  auto; color: #3c3c3c; font-size:21px; font-weight: 400; line-height:5em }
.overview  h2 strong { color: #7e30d4; font-weight: 400 }
.overview  h2 img { display: block; width: auto; }
.overview  h4 { width:768px;   margin: 580px auto 0; color: #fff; font-size:18px; font-weight: 400; background-color: #381c58; padding: 20px 0}
.overview  h4 strong { color:#7aedff; font-size:18px; font-weight: 400; }


.overview_guide { display:block; padding:80px 0 20px;  border-bottom:#e3e3e3 solid 1px;}
.overview_guide h1 { display:block; font-size:48px; color:#000; margin:110px auto 60px; font-weight:400; line-height:1.2em;  } 
.overview_guide h1 strong { font-size:72px; color:#000; font-weight:800;  } 
.overview_guide h1 span { display:block; font-size:21px; color:#4c4c4c;  margin-top:30px;  font-weight:400; line-height:1.2em} 
.overview_guide font {   }
.overview_guide p {  }
.overview_guide img {  margin:0 auto 0;}
.overview_guide .tip_box { margin: 50px auto}


.img_bottom { display:block; width:100%; height:400px;  padding:80px 0; margin: 50px auto; text-align: center; }
.img_bottom img { display:block; margin: 0 auto; text-align: center; }


					.main_section { width: 100%; 	background-color: white; 	padding: 0; margin: 30px auto; }
					.main_section .container { width: 100%; height:730px; border-top:#e5e5e5 solid 1px }
					.box_footprint { width:auto; height:auto }
					counter-increment: my-awesome-counter;

					section h2 { font-family: nanumSqure, 'nanumSqure', 'KoPub Dotum', 나눔고딕; font-size: 48px; text-align: left; letter-spacing:0em; line-height:1.2em; color:#3c3c3c;}
					section h2 strong {  }
					section h2 title { display:block;  width: 100%; font-size:100px; color:#d9d9d9;  font-weight:400; line-height:1.0em;text-align: left;    }
					section h2 font { display:block; width: 100%; font-size:24px; color:#3c3c3c; font-weight:300; line-height:1.2em; text-align: left; padding:0 0 20px 0   }
					section h2 span { display:block; width: 100%; font-size:16px; color:#4c4c4c; font-weight:600; line-height:1.2em;text-align: left; padding:50px 0 30px 0  }
					section h2 p { display:block; width: 80%; font-size:18px; color:#fff;  border-radius:1em; padding:15px 25px; font-weight:400; line-height:1.4em; text-align: left; margin:0 0 0 -20px; }

					section h2.h2_left_left {	float: right; width: 700px; margin-right: -100%; padding: 140px 0 0 0; font-size: 48px; text-align: left; letter-spacing:0em; line-height:1.2em; color:#3c3c3c;}
					section h2.h2_left_left strong {  color:#37ac24 }
					section h2.h2_left_left title {   }
					section h2.h2_left_left font {   }
					section h2.h2_left_left span {   }
					section h2.h2_left_left p {  background-color:#5fae52;   }

					section h2.h2_left_right {float: left; width: 700px; margin-left: 0; padding: 0 0 0 0; font-size: 48px; text-align: left; letter-spacing:0em; line-height:1.2em; color:#3c3c3c; }
					section h2.h2_left_right strong {  color:#4f72cd }
					section h2.h2_left_right title {  }
					section h2.h2_left_right font {   }
					section h2.h2_left_right span {   }
					section h2.h2_left_right p {   background-color:#75a1d3;   }

					section h2.h2_left_bottom {float: right;width: 700px; margin-right: -100%; padding: 140px 0 0 0; font-size: 48px; text-align: left; letter-spacing:0em; line-height:1.2em; color:#3c3c3c;}
					section h2.h2_left_bottom strong {  color:#9050c1 }
					section h2.h2_left_bottom title {   }
					section h2.h2_left_bottom font {   }
					section h2.h2_left_bottom span {   }
					section h2.h2_left_bottom p {  background-color:#a466d3;   }
					section h2.h2_left_bottom span.text_tip {  display:block; width: 100%; font-size:16px; color:#9050c1; font-weight:400; line-height:1.2em; text-align: left; padding:20px 0 0 }
					section h2.h2_left_bottom em {  font-size:24px;  }

					.box_half           {float: left; display: inline-block; width: 540px;}
					.box_half2         {float: right; display: inline-block; width: 640px; margin: 90px 0 0;}
					.box_half3         {float: left; display: inline-block; width: 540px;}
					.box_half_left     {float: left;width: 817px;text-align: left;margin: 90px 0 0 0 ;	}
					.box_half_right   {float: right; text-align: right;margin: 90px 0 0;	}
					.box_half_right2 {float: left; margin: 150px 0 0 120px ;}

					.img_400 {width: 400px;}
					.web { display:block }
					.mobile { display:none; padding-top:30px }

@media all and (max-width:5120px)  { 

					.main_section .container { display: block; width: 1000px; height:auto; border-top:none; margin: 30px auto; }

					section h2.h2_left_left, section h2.h2_left_right, section h2.h2_left_bottom { float:none; width:calc(100% - 60px); margin: 30px auto; display:block; text-align: center; border-top:#e3e3e3 solid 1px; padding:60px 0 20px 0}

					section h2 strong {  }
					section h2 title { text-align: center;  }
					section h2 font{ text-align: center;  }
					section h2 span { text-align: center;  }
					section h2 p { display:block; width: 600px; font-size:18px; color:#fff;  border-radius:1em; padding:15px 25px;  margin: 0 auto; font-weight:400; line-height:1.4em; text-align: center; }
					section h2.h2_left_bottom span.text_tip { text-align: center; }
					section h2.h2_left_bottom em { text-align: center;  }

					.box_half, .box_half2, .box_half3     { float:none; width:calc(100% - 60px); margin: 30px auto; display:block; }
					.box_half_left, .box_half_right, .box_half_right2 { float:none; width:calc(100% - 60px); margin: 30px auto; display:block; }

					.web { display:none }
					.mobile { display:block; padding-top:30px }

}





.footer { display:block; width:100%; margin:0 auto; clear:both; padding:0; background-color:#fff;  border-top:#e3e3e3 solid 1px; }
.footer .sns { float:right; margin-top:37px}
.footer .sns img { display:inline-block; width:32px; padding:0; margin:0 4px; vertical-align:middle}
.footer .box { display:block; max-width:1200px; margin:0 auto;  text-align:left; padding:0 20px; font-size:13px; line-height:1.8em; color:#4c4c4c;  }
.footer .box a:link, 
.footer .box a:active, 
.footer .box a:visited {color:#2daac0; text-decoration:underline; }
.footer .box a:hover {color:#188699; text-decoration:underline;}
.footer .box .footer_logo { display:inline-block;  margin-top:27px; margin-bottom:20px; vertical-align:top }
.footer .box .footer_logo img { }
.footer .box .footer_info { display:inline-block; width:1200px; text-align:left; margin:30px 0 0 0; padding:0 0 0 40px;  vertical-align:top; letter-spacing:-0.03em }
.footer .box .privacy_box { float:right; margin-top:-60px; }
.footer .box .privacy_box a { color:#919090; font-size:13px; text-decoration:none    }
.footer .box .privacy_box .line { font-weight:100; color:#bdbdbd; padding:0 5px; font-family:돋움 }
.footer .copy { width:100%;  border-top:#e3e3e3 solid 1px;  background-color:#FFF; color:#808080; line-height:4em; font-size:11px;  }

/*
.footer .box .sns a:link, 
.footer .box .sns a:active, 
.footer .box .sns a:visited  {float:right; background-color:#808080; border-radius:20px; width:36px; height:36px; padding:0; margin:5px; vertical-align:middle }
.footer .box .sns a:hover { background-color:#8158b4; }
*/

.add_box { display:block; width:960px; background-color:#fafafa; border-radius:40px; margin:50px auto 0; padding:10px 40px; font-size:16px; border:#e5e5e5 solid 1px; letter-spacing:-0.03em; color:#999}
.add_box strong { color:#393 }




@media all and (max-width:1200px){ 


body { min-width:100%; }



.overview, .features, .shop, .support { width:100%; margin:0 auto; text-align:center; }


.overview, .features, .shop, .support, .overview_top { width:100%; margin:0 auto; text-align:center; }


.footer { display:block; width:100%; margin:0 auto; clear:both; padding:0; background-color:#fff;  border-top:#e3e3e3 solid 1px; }
.footer .sns { float:right; margin-top:37px}
.footer .sns img { display:inline-block; width:32px; padding:0; margin:0 4px; vertical-align:middle}
.footer .box { display:block; max-width:100%; margin:0 auto;  text-align:left; padding:0 20px; font-size:13px; line-height:1.8em; color:#4c4c4c;  }
.footer .box a:link, 
.footer .box a:active, 
.footer .box a:visited {color:#2daac0; text-decoration:underline; }
.footer .box a:hover {color:#188699; text-decoration:underline;}
.footer .box .footer_logo { display:inline-block;  margin-top:27px; margin-bottom:20px; vertical-align:top }
.footer .box .footer_logo img { }
.footer .box .footer_info { display:inline-block; width:calc(100% - 200px);   text-align:left; margin:30px 0 0 0; padding:0 0 0 40px;  vertical-align:top; letter-spacing:-0.03em }
.footer .box .privacy_box { float:right; margin-top:-60px; }
.footer .box .privacy_box a { color:#919090; font-size:13px; text-decoration:none    }
.footer .box .privacy_box .line { font-weight:100; color:#bdbdbd; padding:0 5px; font-family:돋움 }
.footer .copy { width:100%;  border-top:#e3e3e3 solid 1px;  background-color:#FFF; color:#808080; line-height:4em; font-size:11px;  }





}









@media all and (max-width:1000px){ 


					.main_section { width:calc(100% - 60px); 	background-color: white; 	padding: 0; margin: 20px auto; }
					.main_section .container { display: block; width: 100%; height:auto; border-top:none; margin: 10px auto; }

					section h2.h2_left_left, section h2.h2_left_right, section h2.h2_left_bottom { float:none; width:100%; margin: 30px auto; display:block; text-align: center; border-top:#e3e3e3 solid 1px; padding:20px 0; font-size: 24px;  line-height:1.8em; }

					section h2 strong {  }
					section h2 title { text-align: center;  font-size:36px; padding:10px 0 }
					section h2 font{ text-align: center;  font-size:13px; padding:0 0 10px 0 }
					section h2 span { text-align: center;  font-size:12px; padding:10px 0 }
					section h2 p { display:block; width:100%;  font-size:14px; color:#fff;  border-radius:0; padding:15px 30px;  margin: 0 0 0 -30px; font-weight:400; line-height:1.4em; text-align: center; }
					section h2.h2_left_bottom span.text_tip { text-align: center; }
					section h2.h2_left_bottom em { text-align: center;  }
					section img { width:100%;  margin: 0 auto; padding:0;}

					.box_half, .box_half2, .box_half3     { float:none; width:100%; margin: 0 auto; display:block; }
					.box_half_left, .box_half_right, .box_half_right2 { float:none; width:100%; margin: 0 auto; padding:0; display:block; }

					section h2.h2_left_bottom span.text_tip {  display:block; width: 100%; font-size:12px; color:#9050c1; font-weight:400; line-height:1.2em; text-align: left; padding:20px 0 0 }
					section h2.h2_left_bottom em {  display:block; font-size:14px;  }


					.web { display:none }
					.mobile { padding-top:0 }






body { min-width:100%; }

.center_img { width:100%; height:240px; background-color:#efeeea; margin:0 auto; text-align:center }
.center_img img { margin:0 auto; text-align:center }




h1 {font-size:36px; color:#1c3866; line-height:1.0em; padding:0; margin:0 auto; font-weight:400; letter-spacing:-0.03em}
h1 span { letter-spacing:-0.01em}
h2 {font-size:21px; color:#7f5e25; line-height:24px; padding:20px 0 0 0; margin:0; font-weight:400;}
h3 {font-size:18px; color:#fff; padding:0; margin:20px auto 10px; text-align:center;}
h4 {font-size:16px; color:#fff; padding:0; margin:0; font-weight:700;}


.overview_top  { display:block; margin:0 auto; height:360px;  background:url("images/img_01.jpg") no-repeat 50% 0;  background-size:auto 500px; padding-top: 140px}
.overview_top  h1 {  width:calc(100% - 60px); margin: 0 auto; text-align: center; color: #fff; font-size: 20px; font-weight: 600; border:#a9cde9 solid 1px; border-radius: 2em; padding:10px 0 }
.overview_top  h3 { color: #fff; font-size: 14px; font-weight: 400; }
.overview_top  h4 { margin: 0 auto 0; color: #fff; font-size:11px; font-weight: 400; }
.overview_top  h4 strong { color:#7aedff; font-size:11px; font-weight: 400; }
.overview_top a { display:block;  margin: 0 auto; text-align: center; padding-top: 5%;color: #fff;  font-size: 30px; font-weight: 800; vertical-align: middle }
.overview_top a:hover { text-decoration: none; color:#7aedff; }
.overview_top a img { display: inline-block ;  vertical-align: middle; padding-right: 18px; }
.overview_top .img_text_3rd {   display:block;   width:calc(100% - 30px);  margin: 0 auto; text-align: center;  padding-top: 5%;}


.overview{ display:block; padding:0; height: 400px;  background:url("images/img_macbook.png") no-repeat 45% 150px;  background-size:auto 200px;  }
.overview h1 { display:block; font-size:36px; color:#000; margin-bottom:40px;} 
.overview h1 span { display:block; font-size:16px; color:#747474; margin-bottom:40px;} 
.overview p { display:block; width:100%; margin:0 auto; font-size:18px; padding:10px 0; letter-spacing:-0.05em; color:#fff; background-color:#414141;}
.overview img { width:100%; margin:0 auto 20px;}
.overview  h2 { margin: 40px  auto; color: #3c3c3c; font-size:16px; font-weight: 400; line-height:5em;  padding:0; }
.overview  h2 strong { color: #7e30d4; font-weight: 400 }
.overview  h2 img { display: block; width:calc(100% - 100px);  }
.overview  h4 { width:calc(100% - 60px);  margin: 260px auto 0; color: #fff; font-size:13px; font-weight: 400; background-color: #381c58; padding: 15px 30px;  letter-spacing:-0.03em }
.overview  h4 strong { color:#7aedff; font-size:13px; font-weight: 400; }


.overview_guide { display:block; padding:80px 0 20px;  border-bottom:#e3e3e3 solid 1px;}
.overview_guide h1 { display:block; font-size:48px; color:#000; margin:110px auto 60px; font-weight:400; line-height:1.2em;  } 
.overview_guide h1 strong { font-size:72px; color:#000; font-weight:800;  } 
.overview_guide h1 span { display:block; font-size:21px; color:#4c4c4c;  margin-top:30px;  font-weight:400; line-height:1.2em} 
.overview_guide font {   }
.overview_guide p {  }
.overview_guide img {  margin:0 auto 0;  text-align: center;   }


.swiper-container { padding-top:40px; }

body { min-width:100%; }

.nav-wrap .mainmenu {  }

.nav_all { position:fixed; float:left; right:calc(100% - 38px); width:32px; margin:4px 0 0 0; z-index:100; list-style:none; display:inline; overflow:hidden; background-color:#fff }
.nav_all a { float:left; padding:32px 0 0 0; overflow:hidden; height:0px !important; height/**/:32px; /* IE5 */ margin:0; border:0;   background-image:url(images/ico_nav.png); background-position:9px 9px ; background-repeat:no-repeat; background-size:20px 20px; background-color:#fff}
.nav_all a:hover { background-image:url(images/ico_nav.png); background-position:9px 9px ;  border:0;}
.nav_all a:active, #nav a.selected {  border:0; }


.nav-wrap {width:100%; height:65px; min-width:320px; padding:0; text-align:center; z-index:999; background-color:#fff;  position:fixed;  border-top:0; border-bottom:#cccccc solid 1px}


.nav-wrap .nav { background:#000; height:80px;  }
.nav-wrap .nav .logo { width:130px; margin:0 auto; height:30px; text-align:center; }
.nav-wrap .nav .logo a {  width:130px; height:17px;  padding:0; margin:14px auto 0; background-image:url(images/logo_w.png); background-size:100% 100%; background-repeat:no-repeat; text-indent:9999px; background-position:center top;}

.nav-wrap .nav .smenu { display:block; width:100%; list-style:none; float:none; position:relative; margin:10px auto 0; }

.nav-wrap .nav ul.mainmenu { display:block; width:calc(100% - 60px);  list-style:none; float:none; margin:5px auto 0; padding:0;  text-align:center;}
.nav-wrap .nav ul.mainmenu li {display:inline-block; padding:0;}
.nav-wrap .nav ul.mainmenu li a {color:#000; font-size:13px; font-weight:600; letter-spacing:-0.01em; text-decoration:none; /*text-transform:uppercase;*/   padding:2px 3px 4px 3px; margin:0 1px;   }
.nav-wrap .nav ul.mainmenu li a:visited {}
.nav-wrap .nav ul.mainmenu li a:hover   {color:#ffffff; text-decoration:none;  background-color:#2b88fa; text-shadow:none; border-radius: 30px; }
.nav-wrap .nav ul.mainmenu li a.checked  {color:#ffffff; text-decoration:none;  background-color:#2b88fa; text-shadow:none; border-radius: 30px; }
.nav-wrap .nav ul.mainmenu li a:active  {color:#ffffff; text-decoration:none;  background-color:#2b88fa; text-shadow:none; border-radius: 30px; }
.nav-wrap .nav ul.mainmenu li.f-right {float:right; padding-right:0; padding-left:10px; margin-top:-7px}


.nav-scroll { background-color:#fff; border-bottom:1px #e6e6e6 solid; position:fixed; z-index:999;  opacity: 1;  transition: all 0.3s; height:60px; }
.nav-scroll .nav {  background:#fff; height:80px; border-bottom:1px #e6e6e6 solid; }
.nav-scroll .nav .logo a {  float:left; padding:0; margin:14px 0 0 0; background-image:url(images/logo.png); background-size:100% 100%; background-repeat:no-repeat; text-indent:9999px;background-position:left top;}
.nav-scroll .nav .smenu { list-style:none; float:right; position:relative;  }
.nav-scroll .nav ul.mainmenu {  list-style:none; float:left; margin:20px 0 0 94px; padding:0;}
.nav-scroll .nav ul.mainmenu li {display:inline-block; padding:0 0 0 0;}
.nav-scroll .nav ul.mainmenu li a {  }
.nav-scroll .nav ul.mainmenu li a:visited {}
.nav-scroll .nav ul.mainmenu li a:hover   {color:#ffffff; text-decoration:none;  background-color:#2b88fa; text-shadow:none; border-radius: 30px; }
.nav-scroll .nav ul.mainmenu li a.checked   {color:#ffffff; text-decoration:none;  background-color:#2b88fa; text-shadow:none; border-radius: 30px; }
.nav-scroll .nav ul.mainmenu li a:active  {color:#ffffff; text-decoration:none;  background-color:#2b88fa; text-shadow:none; border-radius: 30px; }
.nav-scroll .nav ul.mainmenu li.f-right {float:right; padding-right:0; padding-left:10px; margin-top:-7px}
.nav-wrap .nav .smenu { display:block; width:100%; list-style:none; float:none; position:relative; margin:10px auto 0; }



/*****  member *****/

.footer { display:block; width:100%; margin:0 auto 0; clear:both; padding:0 0 0 0; background-color:#fff }
.footer .sns { float:right; margin-top:37px}
.footer .sns img { display:inline-block; width:32px; padding:0; margin:0 4px; vertical-align:middle}
.footer .box { display:block; max-width:90%; margin:0 auto;  text-align:left; padding:0; font-size:9px; line-height:1.8em; color:#808080;  }
.footer .box a:link, 
.footer .box a:active, 
.footer .box a:visited {color:#4b8dff; text-decoration:underline; }
.footer .box a:hover {color:#4b8dff; text-decoration:underline;}
.footer .box .footer_logo { display:none; width:150px; margin-top:40px; vertical-align:top }
.footer .box .footer_logo img {}
.footer .box .footer_info { display:inline-block; width:95%; text-align:left; margin:10px 0; padding:0;  vertical-align:top; letter-spacing:-0.03em }
.footer .box .privacy_box { float:none; margin-top:10px; }
.footer .box .privacy_box a { color:#919090; font-size:9px; text-decoration:none    }
.footer .box .privacy_box .line { font-weight:100; color:#bdbdbd; padding:0 5px; font-family:돋움 }
.footer .copy { width:100%;  border-top:#e3e3e3 solid 1px; background-color:#FFF; color:#808080; line-height:4em; font-size:8px;  }


.email_box { position:fixed; bottom:20px; right:15px;  float:right; width:48px;  z-index:100 }
.email_box img {  width:48px; }

.add_box { display:block;width:calc(100% - 60px);   background-color:#fff; border-radius:10px; margin:0 auto 20px; padding:10px 10px; font-size:13px; line-height:1.3em;  }
.add_box strong { }

}


/*****  Guide Page CSS *****/

.guide_box {
    background-color: #0E1C26;
    display: block;
    margin: 0 auto;
    padding-top: 165px;
    padding-bottom: 50px;
}

.img_1 {
    margin: 0 auto;
    max-width: 1000px;
}

.h2_style {
    color: #fff;
    font-size: 32px;
    padding-bottom: 26px;
}

.h2_style1 {
    color: #fff;
    font-size: 32px;
    padding-bottom: 26px;
    padding-top: 45px;
}

.h2_style2 {
    color: #fff;
    font-size: 32px;
    padding-bottom: 50px;
    padding-top: 50px;
}

.p_style {
    text-align: left;
    color: #fff;
    font-size: 15px;
    margin: 0 auto;
    max-width: 1000px;
    line-height: 35px;
    padding-top: 20px;
}

.p_style1 {
    text-align: center;
    color: #fff;
    font-size: 20px;
    margin: 0 auto;
    max-width: 1000px;
    line-height: 35px;
    padding-top: 20px;
}


@media (max-width: 1000px) {
    .guide_box .h2_style {font-size: 22px;}
    .guide_box .p_style {
        font-size: 18px;
        line-height: 2;
        padding-left: 40px;
    }

    .guide_box .img_1 {
        display: inline-block;
        width: calc(100% - 80px);
        height: auto;
        padding: 0 40px 10px 40px;
        border-right: none;
        vertical-align: top;
    }
}



