@import url(font.css);

* {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

/* 기본사이즈 62.5% = 10px , 1rem = 10px, 1.5rem = 15px */
html {/*font-size:62.5%;*/ font-size:10px; }
body {font-size:1.5rem; line-height:1.6; font-weight:400; font-family:'Noto Sans KR', sans-serif; color:#262626; }
/* noto snas ie용 ttf별도로 추가할것 */

/* Typo */
h1 { font-size:5.0rem; }
h2 { font-size:4.2rem; }
h3 { font-size:3.6rem; }
h4 { font-size:3.0rem; }
h5 { font-size:2.4rem; }
h6 { font-size:1.8rem; }
p {margin-top:0; }

/* Link */
a {color:#262626; text-decoration:none; cursor:pointer; }
a:hover {color:#262626; }

/* List */
ul {list-style:none; }
ul.disc {list-style:disc inside; }
ul.circle {list-style:circle inside; }
ol {list-style:decimal inside; }
ol, ul {padding-left:0; margin-top:0; }
ul ul, ul ol, ol ol, ol ul {margin:1.5rem 0 1.5rem 3rem; font-size:90%; }
li {margin-bottom:1rem; }

/* Table */
table {width:100%; /*margin:0!important; padding:0!important;*/ }
/*th, td {padding:1.2rem 2rem; text-align:left; border-bottom:solid 0px #e1e1e1; vertical-align:middle; }
th:first-child,
td:first-child {padding-left:0; }
th:last-child, td:last-child {padding-right:0; }*/

/* Space */
button, .button {margin-bottom:1rem; }
input, textarea, select, fieldset {margin-bottom:1.5rem; }
pre, blockquote, dl, figure, table, p, ul, ol, form {margin-bottom:2.5rem; }

/* Misc */
hr {margin-top:1rem; margin-bottom:1.5rem; border-width:0; border-top:solid .1rem #e1e1e1; }
.full-width {width:100%; }
.mfull-width {max-width:100%; }
.pull-right {float:right; }
.pull-left {float:left; }
.text-center {text-align:center; }
.text-left {text-align:left; }
.text-right {text-align:right; }

/* Clearing */
.container:after,
.row:after,
.clearfix:after {content: ""; display:table; clear:both; }

/* Setting */
.mg0 {margin:0; }
.mgt0 {margin-top:0; }
.mgt10 {margin-top:1rem; }
.mgt20 {margin-top:2rem; }
.mgt30 {margin-top:3rem; }
.mgt40 {margin-top:4rem; }
.mgt50 {margin-top:5rem; }
.mgt60 {margin-top:6rem; }
.mgt70 {margin-top:7rem; }
.mgt80 {margin-top:8rem; }
.mgt90 {margin-top:9rem; }
.mgt100 {margin-top:10rem; }

.mgb0 {margin-bottom:0; }
.mgb10 {margin-bottom:1rem; }
.mgb20 {margin-bottom:2rem; }
.mgb30 {margin-bottom:3rem; }
.mgb40 {margin-bottom:4rem; }
.mgb50 {margin-bottom:5rem; }
.mgb60 {margin-bottom:6rem; }
.mgb70 {margin-bottom:7rem; }
.mgb80 {margin-bottom:8rem; }
.mgb90 {margin-bottom:9rem; }
.mgb100 {margin-bottom:10rem; }

.font-bold {font-weight:bold; }

.scrollToTop {display:block; position:fixed; z-index:1100; bottom:10rem; right:3rem; width:4.5rem; height:4.5rem; line-height:4.5rem; background:#262626; color:#fff; border-radius:.3rem; -webkit-border-radius:.3rem; -moz-border-radius:.3rem; -o-border-radius:.3rem; -ms-border-radius:.3rem; text-align:center; }
@media only screen and (max-width: 76.8rem) {
	.scrollToTop {bottom:.3rem; right:.3rem; }
}

/* Button */
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
	display:inline-block;
	height:3.8rem;
	padding:0 2rem;
	color:#555;
	text-align:center;
	font-size:1.3rem;
	font-weight:600;
	line-height:3.8rem;
	letter-spacing:.1rem;
	text-transform:uppercase;
	text-decoration:none;
	white-space:nowrap;
	background-color:transparent;
	border-radius:.4rem;
	border:solid .1rem #bbb;
	cursor:pointer; }
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
	color:#333;
	border-color:#888;
	outline:0; }



/* Button black */
.button.button-black,
button.button-black,
input[type="submit"].button-black,
input[type="reset"].button-black,
input[type="button"].button-black {
	color:#fff;
	background-color:#262626;
	border-color:#262626; }
.button.button-black:hover,
button.button-black:hover,
input[type="submit"].button-black:hover,
input[type="reset"].button-black:hover,
input[type="button"].button-black:hover,
.button.button-black:focus,
button.button-black:focus,
input[type="submit"].button-black:focus,
input[type="reset"].button-black:focus,
input[type="button"].button-black:focus {
	color:#fff;
	background-color:#000;
	border-color:#000; }

/* Button gray */
.button.button-gray,
button.button-gray,
input[type="submit"].button-gray,
input[type="reset"].button-gray,
input[type="button"].button-gray {
	color:#262626;
	background-color:#dde2e6;
	border-color:#c6cace; }
.button.button-gray:hover,
button.button-gray:hover,
input[type="submit"].button-gray:hover,
input[type="reset"].button-gray:hover,
input[type="button"].button-gray:hover,
.button.button-gray:focus,
button.button-gray:focus,
input[type="submit"].button-gray:focus,
input[type="reset"].button-gray:focus,
input[type="button"].button-gray:focus {
	color:#262626;
	background-color:#d0d5d8;
	border-color:#c6cace; }

/* Button green */
.button.button-green,
button.button-green,
input[type="submit"].button-green,
input[type="reset"].button-green,
input[type="button"].button-green {
	color:#fff;
	background-color:#1bbc9b;
	border-color:#1bbc9b; }
.button.button-green:hover,
button.button-green:hover,
input[type="submit"].button-green:hover,
input[type="reset"].button-green:hover,
input[type="button"].button-green:hover,
.button.button-green:focus,
button.button-green:focus,
input[type="submit"].button-green:focus,
input[type="reset"].button-green:focus,
input[type="button"].button-green:focus {
	color:#fff;
	background-color:#11ab8b;
	border-color:#11ab8b; }

/* Button blue */
.button.button-blue,
button.button-blue,
input[type="submit"].button-blue,
input[type="reset"].button-blue,
input[type="button"].button-blue {
	color:#fff;
	background-color:#3299db;
	border-color:#3299db; }
.button.button-blue:hover,
button.button-blue:hover,
input[type="submit"].button-blue:hover,
input[type="reset"].button-blue:hover,
input[type="button"].button-blue:hover,
.button.button-blue:focus,
button.button-blue:focus,
input[type="submit"].button-blue:focus,
input[type="reset"].button-blue:focus,
input[type="button"].button-blue:focus {
	color:#fff;
	background-color:#268ccd;
	border-color:#268ccd; }

/* Button yellow */
.button.button-yellow,
button.button-yellow,
input[type="submit"].button-yellow,
input[type="reset"].button-yellow,
input[type="button"].button-yellow {
	color:#fff;
	background-color:#f5b432;
	border-color:#f5b432; }
.button.button-yellow:hover,
button.button-yellow:hover,
input[type="submit"].button-yellow:hover,
input[type="reset"].button-yellow:hover,
input[type="button"].button-yellow:hover,
.button.button-yellow:focus,
button.button-yellow:focus,
input[type="submit"].button-yellow:focus,
input[type="reset"].button-yellow:focus,
input[type="button"].button-yellow:focus {
	color:#fff;
	background-color:#e8a725;
	border-color:#e8a725; }

/* Button red */
.button.button-red,
button.button-red,
input[type="submit"].button-red,
input[type="reset"].button-red,
input[type="button"].button-red {
	color:#fff;
	background-color:#e54c42;
	border-color:#e54c42; }
.button.button-red:hover,
button.button-red:hover,
input[type="submit"].button-red:hover,
input[type="reset"].button-red:hover,
input[type="button"].button-red:hover,
.button.button-red:focus,
button.button-red:focus,
input[type="submit"].button-red:focus,
input[type="reset"].button-red:focus,
input[type="button"].button-red:focus {
	color:#fff;
	background-color:#db4238;
	border-color:#db4238; }

/* Form */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],

select {
	height:3.8rem;
	/*padding:.6rem 1rem;*/
	background-color:#fff;
	border:solid .1rem #d1d1d1;
	border-radius:.4rem;
	box-shadow:none; }
textarea {
	padding:.6rem 1rem;
	background-color:#fff;
	border:solid .1rem #d1d1d1;
	border-radius:.4rem;
	box-shadow:none; }
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none; }

textarea {min-height:6.5rem; padding-top:.6rem; padding-bottom:.6rem; }

input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
	border:solid .1rem #262626;
	outline:0; }
label,
legend {
	display:block;
	margin-bottom:.5rem;
	font-weight:bold; }
fieldset {
	padding:0;
	border-width:0; }
input[type="checkbox"],
input[type="radio"] {
	display:inline; }
label > .label-body {
	display:inline-block;
	margin-left:.5rem;
	font-weight:normal; }

/* Base grid */
.container {position:relative; width:100%; max-width:110rem; margin:0 auto; padding:0; }
.col {float:left; width:100%; margin-left:4%; }
.col:first-child {margin-left:0; }

.col1 {width:4.66666666667%; }
.col2 {width:13.3333333333%; }
.col3 {width:22%; }
.col4 {width:30.6666666667%; }
.col5 {width:39.3333333333%; }
.col6 {width:48%; }
.col7 {width:56.6666666667%; }
.col8 {width:65.3333333333%; }
.col9 {width:74.0%; }
.col10 {width:82.6666666667%; }
.col11 {width:91.3333333333%; }
.col12 {width:100%; margin-left:0; }

.xs-hidden {display:block; }
@media only screen and (max-width: 76.8rem) {
	.col.col1.xs-hidden,
	.col.col2.xs-hidden,
	.col.col3.xs-hidden,
	.col.col4.xs-hidden,
	.col.col5.xs-hidden,
	.col.col6.xs-hidden,
	.col.col7.xs-hidden,
	.col.col8.xs-hidden,
	.col.col9.xs-hidden,
	.col.col10.xs-hidden,
	.col.col11.xs-hidden,
	.col.col12.xs-hidden {display:none; }
}


/* Media query */
@media only screen and (max-width : 128rem){
	.container {width:95%; }
}

@media only screen and (max-width : 102.4rem){
	.container {}
}

@media only screen and (max-width : 76.8rem){
	h1, h2, h3, h4, h5, h6 {margin-top:2rem; margin-bottom:2rem; }
	h1 { font-size:4.0rem; line-height:1.2;  letter-spacing:-.1rem;}
	h2 { font-size:3.6rem; line-height:1.25; letter-spacing:-.1rem; }
	h3 { font-size:3.0rem; line-height:1.3;  letter-spacing:-.1rem; }
	h4 { font-size:2.4rem; line-height:1.35; letter-spacing:-.08rem; }
	h5 { font-size:1.8rem; line-height:1.5;  letter-spacing:-.05rem; }
	h6 { font-size:1.5rem; line-height:1.6;  letter-spacing:0; }
	.container {outline:solid .0rem red; }
	.col {display:block; width:100%; margin:0; }
}

.swiper-container {width:100%; height:30rem; margin-left:auto; margin-right:auto; }
.swiper-slide {background-size:cover; background-position:center; }
.gallery-top {height:80%; width:100%; }
.gallery-thumbs {height:20%; box-sizing:border-box; padding:1rem 0; }
.gallery-thumbs .swiper-slide {height:100%; opacity:0.4; }
.gallery-thumbs .swiper-slide-active {opacity:1; }

