﻿@charset "utf-8";

/* @import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(http://cdn.rawgit.com/hiun/NanumSquare/master/nanumsquare.css); */

@font-face {
font-family: Nanum Square;
src: local(NanumSquareR),
local(NanumSquare),
url(../fonts/NanumSquareR.eot) format('embedded-opentype'),
url(../fonts/NanumSquareR.woff) format('woff');
font-style: normal;
font-weight: normal;
unicode-range: U+0-10FFFF;
}

@font-face {
font-family: Nanum Square;
src: local(NanumSquareB),
url(../fonts/NanumSquareB.eot) format('embedded-opentype'),
url(../fonts/NanumSquareB.woff) format('woff');
font-weight: 700;
}

@font-face {
font-family: Nanum Gothic;
src: local(NanumGothic),
local(NanumGothic),
url(../fonts/NanumGothic.eot) format('embedded-opentype'),
url(../fonts/NanumGothic.woff) format('woff');
font-style: normal;
font-weight: normal;
unicode-range: U+0-10FFFF;
}

@font-face {
font-family: Nanum Gothic;
src: local(NanumGothicBold),
url(../fonts/NanumGothicBold.eot) format('embedded-opentype'),
url(../fonts/NanumGothicBold.woff) format('woff');
font-weight: 700;
}

html {overflow-y: scroll;}
			
html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, a, em, img, q, strong, sub, sup, b, u, i, center, dl, dt, dd, ol, ul, li,
form, label, table, caption, tbody, tfoot, thead, tr, th, td, article, footer, header, menu, nav, section {
margin: 0;
padding: 0;
}

*, *:before, *:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}

article, footer, header, menu, nav, section {display: block;}

body, table, th, td, button, select, input, textarea {
font-family: 'Nanum Gothic', Arial, "돋움", Dotum, sans-serif;
font-size: 15px;
color: #303030;
-webkit-text-size-adjust: none;
}
			
body {
line-height: 1;
background-color: #fff;
}

h1, h2, h3, h4, h5, h6 {
font-family: 'Nanum Square', Arial, "돋움", Dotum, sans-serif;
letter-spacing: 0;
text-transform: uppercase;
}

h1 {font-size: 60px;}
h2 {font-size: 50px;}
h3 {font-size: 40px;}
h4 {font-size: 35px;}
h5 {font-size: 30px;}
h6 {font-size: 20px;}
			
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
color: inherit;
text-decoration: none;
}

/* @media */
@media all and (max-width:1200px) {
	h1 {font-size: 55px;}
	h2 {font-size: 45px;}
	h3 {font-size: 37px;}
	h4 {font-size: 34px;}
	h5 {font-size: 28px;}
	h6 {font-size: 19px;}
}

@media all and (max-width:980px) {
	h1 {font-size: 50px;}
	h2 {font-size: 40px;}
	h3 {font-size: 34px;}
	h4 {font-size: 32px;}
	h5 {font-size: 26px;}
	h6 {font-size: 18px;}
}

@media all and (max-width:800px) {
	h1 {font-size: 45px;}
	h2 {font-size: 35px;}
	h3 {font-size: 31px;}
	h4 {font-size: 30px;}
	h5 {font-size: 24px;}
	h6 {font-size: 17px;}
}

@media all and (max-width:480px) {
	h1 {font-size: 43px;}
	h2 {font-size: 32px;}
	h3 {font-size: 28px;}
	h4 {font-size: 27px;}
	h5 {font-size: 22px;}
	h6 {font-size: 16px;}
}

@media all and (max-width:350px) {
	h1 {font-size: 40px;}
	h2 {font-size: 30px;}
	h3 {font-size: 25px;}
	h4 {font-size: 24px;}
	h5 {font-size: 20px;}
	h6 {font-size: 15px;}
}

ol, ul {list-style: none;}

img {
border: 0;
vertical-align: middle;
}

table {
width: 100%;
border-collapse: collapse;
border-spacing: 0;
box-sizing: border-box;
}

button {
margin: 0px;
padding: 0px;
cursor: pointer;
border: 0px;
background: none;
text-transform: none;
line-height: normal;
}
									
em, var {
font-style: normal;
font-weight: normal;
}
									
a {
color: #303030;
text-decoration: none;
outline: none;
}
a:active, a:hover, a:focus {text-decoration: none;}
a:hover {color: #0086e0;}

.clearfix {*zoom: 1;}

.clearfix:after {
clear: both; 
display: block; 
content: "";
}

.float-r {float: right;}

ul.dot-1 {display: inline-block;}

ul.dot-1 li {
background: url("../images/common/dot_01.png") no-repeat 0 12px;
padding-left: 15px;
}
			
.margin-top30 {margin-top: 30px;}

.font-color-w {color: #fff;}
.font-color-b1 {color: #0071bc;}
.font-highlight-b1 {background: linear-gradient(to top, #acf9f9 60%, transparent 40%);}
.font-highlight-y1 {background: linear-gradient(to top, #eeff5b 60%, transparent 40%);}
.font-highlight-o1 {background: linear-gradient(to top, #ffe08a 60%, transparent 40%);}
.font-highlight-p1 {background: linear-gradient(to top, #edc1ff 60%, transparent 40%);}
			
/* Width */
.max-w1 {max-width: 1120px;}
.max-w2 {max-width: 1200px;}
.max-w4 {max-width: 1500px;}
.max-w5 {max-width: 1700px;}

/* Border */
.border-rw1 {border-right: 1px solid rgba(255, 255, 255, 0.1);}
.border-rw1:last-child {border: 0;}
			
/* Box */
.box-area-w {background-color: #fff;}
.box-area-wb {background-color: #fff; border: 1px solid #ddd;}
.box-area-g1 {background-color: #f8f8f8;}
.box-area-d1 {background-color: #292c31;}
.box-area-d2 {background-color: #3e4145;}
.box-area-h1 {background-color: #e7f2f3;}
			
/* Row */
.row {
display: -webkit-flex;
display: -moz-flex;
display: -o-flex;
display: -ms-flex;
display: flex;
-webkit-flex-wrap: wrap;
-moz-flex-wrap: wrap;
-o-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-align-items: stretch;
-moz-align-items: stretch;
-o-align-items: stretch;
-ms-align-items: stretch;
align-items: stretch;
box-sizing: border-box;
}

.row-column1 {
display: -webkit-flex;
display: -moz-flex;
display: -o-flex;
display: -ms-flex;
display: flex;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-o-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-align-items: center;
-moz-align-items: center;
-o-align-items: center;
-ms-align-items: center;
align-items: center;
-webkit-justify-content: center;
-moz-justify-content: center;
-o-justify-content: center;
-ms-justify-content: center;
justify-content: center;
}

.row > * {box-sizing: border-box;}

.row.aln-left {justify-content: flex-start;}
.row.aln-center {justify-content: center;}
.row.aln-right {justify-content: flex-end;}
.row.aln-top {align-items: flex-start;}
.row.aln-middle {align-items: center;}
.row.aln-bottom {align-items: flex-end;}

.row > .col-1 {width: 100%;}
.row > .col-2 {width: 50%;}
.row > .col-3 {width: 33.33333%;}
.row > .col-4 {width: 25%;}

/* Button */
input[type="button"], button, .button {
-webkit-appearance: none;
-moz-appearance: none;
-o-appearance: none;
-ms-appearance: none;
appearance: none;
position: relative;
display: inline-block;
text-decoration: none;
outline: 0;
cursor: pointer;
overflow: hidden;
}

input[type="button"]:hover, button:hover, .button:hover {
background-color: #0071bc;
color: #fff;
}

input[type="button"]:active, button:active, .button:active {background-color: #0071bc;}

.button-basic {
display: inline-block;
color: #303030;
font-weight: 700;
border: 2px solid #303030;
padding: 23px 60px;
}

.button-basic:hover {border: 2px solid #0086e0;}

.button-rw1 {
display: inline-block;
color: rgba(255, 255, 255, 0.7);
border: 1px solid rgba(255, 255, 255, 0.5);
padding: 12px 28px;
}

.button-rw1:hover {color: rgba(255, 255, 255, 1); border: 1px solid rgba(255, 255, 255, 1);}

/* @media */
@media all and (max-width:800px) {
	.button-basic {padding: 20px 50px;}
}

@media all and (max-width:480px) {
	.button-basic {padding: 17px 40px;}
}

@media all and (max-width:350px) {
	.button-rw1 {padding: 10px 25px;}
}