/*-----------------------------------------------------------------------------------

  Project: http://www.JEIS.pe.kr
  Author: 류준석
  Version: 2.0
  Last Update: 2022.12.15

  - 1.Common styles
  - 2.Color & Background Color & Background Image
  - 3.Basic Layout Styles
  - 4.align & float
  - 5.margin & padding
  - 6.Columns & Grids - 5column
  - 7.img

-----------------------------------------------------------------------------------*/

@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css); /* Light 300, Regular 400, Medium 500, Bold 700, Black 900 가능 Thin 250, DemiLight 350 지원안함 */

/* ----------------------------------------------------------------
	1. Common styles
-----------------------------------------------------------------*/

html, body { height: 100%; font-size: 12px; }
body { overflow-x: hidden; }

header, section, nav, article, aside, footer { display: block; }

a img {border: none;}
iframe { border: none !important;}

dl, dt, dd, ol, ul, li {margin:0; padding:0;}

.clear {clear:both; display:block; font-size:0px; height:0px; line-height:0; width:100%; overflow:hidden;}

::selection {background:#e62335; color:#FFF; text-shadow:none;}
::-moz-selection {background:#e62335; color:#FFF; text-shadow: none;}/* Firefox */
::-webkit-selection {background:#e62335; color:#FFF; text-shadow: none;}/* Safari */

:active,:focus { outline: none !important; }

.hidden { display: none !important; }
.nothidden { display: block !important; }
.inline-block {	float: none !important;	display: inline-block !important; }

.glass { opacity: .5; }

.round {
    -webkit-border-radius: 2px !important;
    -moz-border-radius: 2px !important;
    border-radius: 2px !important;
}

.animate, .animate *{
    -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
    -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
    -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
    -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
    transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}

.no-animate, .no-animate *{
    -webkit-transition: 0 none !important;
    -moz-transition: 0 none !important;
    -ms-transition: 0 none !important;
    -o-transition: 0 none !important;
    transition:0 none !important;
}

.shadow{
    -webkit-box-shadow: 0px 3px 50px rgba(0, 0, 0, .15);
    -moz-box-shadow: 0px 3px 50px rgba(0, 0, 0, .15);
    box-shadow: 0px 3px 50px rgba(0, 0, 0, .15);
}
.white-shadow{
    -webkit-box-shadow: 0px 0px 200px rgba(255, 255, 255, .2);
    -moz-box-shadow: 0px 0px 200px rgba(255, 255, 255, .2);
    box-shadow: 0px 0px 200px rgba(255, 255, 255, .2);
}


img:not([draggable]), embed, object, video {
    max-width: 100%;
    height: auto;
}

.stick-fixed{
    position: fixed !important;
    top: 0;
    left: 0;
}

.clearlist, .clearlist li {
    list-style: none;
    padding: 0;
    margin: 0;
    background: none;
}


/* ----------------------------------------------------------------
	2.Typography
-----------------------------------------------------------------*/

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 300;
    color: #666;
  	line-height: 1.5;
}

a { text-decoration:none !important; color:#111; }
a:hover{ color: #888; }
a:focus,
a:active{
    -moz-outline: none;
    outline: none;
}

strong, .bold { font-weight: bold; }
.upper { text-transform: uppercase; }

/*
small { color: #aaa; }
*/

h1,h2,h3,h4,h5,h6 { color:#444; font-weight:500; line-height:1; }

/*
h1 {font-size: 36px;}
h2 {font-size: 30px;}
h3 {font-size: 24px;}
h4 {font-size: 18px;}
h5 {font-size: 14px;}
h6 {font-size: 12px;}
*/

pre,ul,ol,dl,dd,blockquote,address,table,fieldset,form {margin-bottom: 30px;}
@media only screen and (min-width: 200px) and (max-width: 767px) {
	pre,ul,ol,dl,dd,blockquote,address,table,fieldset,form {margin-bottom: 15px;}
}

/* ----------------------------------------------------------------
	3. Color & Background Color
-----------------------------------------------------------------*/

.color-fff {color:#fff;}
.color-eee {color:#eee;}
.color-ccc {color:#ccc;}
.color-999 {color:#999;}
.color-666 {color:#666;}
.color-333 {color:#333;}
.color-111 {color:#111;}
.color-000 {color:#000;}
.color-orange {color:#ff3300;}
.color-red {color:#e62335;}
.color-green {color:#1ABC9C;}
.color-blue {color:#3498DB;}

.bg-fff {background-color:#fff;}
.bg-fefefe {background-color:#fefefe;}
.bg-f9f9f9 {background-color: #f9f9f9;}
.bg-eee {background-color:#eee;}
.bg-ccc {background-color:#ccc;}
.bg-999 {background-color:#999;}
.bg-666 {background-color:#666;}
.bg-333 {background-color:#333;}
.bg-111 {background-color:#111;}
.bg-000 {background-color:#000;}
.bg-red {background-color:#e62335;}
.bg-green {background-color:#1ABC9C;}
.bg-blue {background-color:#3498DB;}

/* ----------------------------------------------------------------
	4. Sections
-----------------------------------------------------------------*/

section {
    position: relative;
    overflow: hidden;
}

.section {
	position: relative;
	margin: 60px 0;
	padding: 60px 0;
	background-color: #F9F9F9;
	overflow: hidden;
}

.section .container { z-index: 2; }

.container2000 { max-width: 2000px; margin-left: auto; margin-right: auto;}

.fullscreen { height: 100vh; }

/* ----------------------------------------------------------------
	5. align & float
-----------------------------------------------------------------*/

.tright, .align-right { text-align: right !important; }
.tleft, .align-left { text-align: left !important; }
.center { text-align: center !important; }
.fright, .right { float: right !important; }
.fleft, .left { float: left !important; }
.fnone { float: none !important; }
.divcenter {
	position: relative !important;
	float: none !important;
	margin-left: auto !important;
	margin-right: auto !important;
}
.vertical-middle {height: auto !important; left: 0;}

.table-struct { display: table !important; }
.table-cell { display: table-cell !important; }
.vertical-align-middle { vertical-align: middle !important; }
.vertical-middle {height: auto !important; left: 0;}

/* ----------------------------------------------------------------
	6. margin & padding
-----------------------------------------------------------------*/

/* margin */
.allmargin-lg { margin: 80px !important; }
.leftmargin-lg { margin-left: 80px !important; }
.rightmargin-lg { margin-right: 80px !important; }
.topmargin-lg { margin-top: 80px !important; }
.bottommargin-lg { margin-bottom: 80px !important; }

.allmargin { margin: 50px !important; }
.leftmargin { margin-left: 50px !important; }
.rightmargin { margin-right: 50px !important; }
.topmargin { margin-top: 50px !important; }
.bottommargin { margin-bottom: 50px !important; }

.allmargin-sm { margin: 30px !important; }
.leftmargin-sm { margin-left: 30px !important; }
.rightmargin-sm { margin-right: 30px !important; }
.topmargin-sm { margin-top: 30px !important; }
.bottommargin-sm { margin-bottom: 30px !important; }

.allmargin-xs { margin: 15px !important; }
.leftmargin-xs { margin-left: 15px !important; }
.rightmargin-xs { margin-right: 15px !important; }
.topmargin-xs { margin-top: 15px !important; }
.bottommargin-xs { margin-bottom: 15px !important; }

@media only screen and (max-width: 767px) {
  .allmargin-lg { margin: 50px !important; }
  .leftmargin-lg { margin-left: 50px !important; }
  .rightmargin-lg { margin-right: 50px !important; }
  .topmargin-lg { margin-top: 50px !important; }
  .bottommargin-lg { margin-bottom: 50px !important; }

	.allmargin { margin: 30px !important; }
	.leftmargin { margin-left: 30px !important; }
	.rightmargin { margin-right: 30px !important; }
	.topmargin { margin-top: 30px !important; }
	.bottommargin { margin-bottom: 30px !important; }
	.topmargin-m { margin-top: 30px !important; }

	.allmargin-sm { margin: 20px !important; }
	.leftmargin-sm { margin-left: 20px !important; }
	.rightmargin-sm { margin-right: 20px !important; }
	.topmargin-sm { margin-top: 20px !important; }
	.bottommargin-sm { margin-bottom: 20px !important; }
	.topmargin-sm-m { margin-top: 20px !important; }

	.allmargin-xs { margin: 10px !important; }
	.leftmargin-xs { margin-left: 10px !important; }
	.rightmargin-xs { margin-right: 10px !important; }
	.topmargin-xs { margin-top: 10px !important; }
	.bottommargin-xs { margin-bottom: 10px !important; }
}

.nomargin {margin: 0 !important; }
.noleftmargin { margin-left: 0 !important; }
.norightmargin { margin-right: 0 !important; }
.notopmargin { margin-top: 0 !important; }
.nobottommargin { margin-bottom: 0 !important; }

/* padding */

.allpadding-lg { padding: 80px !important; }
.leftpadding-lg { padding-left: 80px !important; }
.rightpadding-lg { padding-right: 80px !important; }
.toppadding-lg { padding-top: 80px !important; }
.bottompadding-lg { padding-bottom: 80px !important; }

.allpadding { padding: 50px !important; }
.leftpadding { padding-left: 50px !important; }
.rightpadding { padding-right: 50px !important; }
.toppadding { padding-top: 50px !important; }
.bottompadding { padding-bottom: 50px !important; }

.allpadding-sm { padding: 30px !important; }
.leftpadding-sm { padding-left: 30px !important; }
.rightpadding-sm { padding-right: 30px !important; }
.toppadding-sm { padding-top: 30px !important; }
.bottompadding-sm { padding-bottom: 30px !important; }

.allpadding-xs { padding: 15px !important; }
.leftpadding-xs { padding-left: 15px !important; }
.rightpadding-xs { padding-right: 15px !important; }
.toppadding-xs { padding-top: 15px !important; }
.bottompadding-xs { padding-bottom: 15px !important; }

@media only screen and (max-width: 767px) {

  .allpadding-lg { padding: 50px !important; }
  .leftpadding-lg { padding-left: 50px !important; }
  .rightpadding-lg { padding-right: 50px !important; }
  .toppadding-lg { padding-top: 50px !important; }
  .bottompadding-lg { padding-bottom: 50px !important; }

	.allpadding { padding: 30px !important; }
	.leftpadding { padding-left: 30px !important; }
	.rightpadding { padding-right: 30px !important; }
	.toppadding { padding-top: 30px !important; }
	.bottompadding { padding-bottom: 30px !important; }
	.toppadding-m { padding-top: 30px !important; }

	.allpadding-sm { padding: 20px !important; }
	.leftpadding-sm { padding-left: 20px !important; }
	.rightpadding-sm { padding-right: 20px !important; }
	.toppadding-sm { padding-top: 20px !important; }
	.bottompadding-sm { padding-bottom: 20px !important; }
	.toppadding-sm-m { padding-top: 20px !important; }

	.allpadding-xs { padding: 10px !important; }
	.leftpadding-xs { padding-left: 10px !important; }
	.rightpadding-xs { padding-right: 10px !important; }
	.toppadding-xs { padding-top: 10px !important; }
	.bottompadding-xs { padding-bottom: 10px !important; }
}

.nopadding { padding: 0 !important; }
.noleftpadding { padding-left: 0 !important; }
.norightpadding { padding-right: 0 !important; }
.notoppadding { padding-top: 0 !important; }
.nobottompadding { padding-bottom: 0 !important; }


/* ----------------------------------------------------------------
	7. Samll Row
-----------------------------------------------------------------*/

.rowSmall { margin-right: -5px; margin-left: -5px; }
.rowSmall > .col-xs-1, .rowSmall > .col-xs-2, .rowSmall > .col-xs-3, .rowSmall > .col-xs-4, .rowSmall > .col-xs-5, .rowSmall > .col-xs-6, .rowSmall > .col-xs-7, .rowSmall > .col-xs-8, .rowSmall > .col-xs-9, .rowSmall > .col-xs-10, .rowSmall > .col-xs-11 { padding-right: 5px; padding-left: 5px; }
.rowSmall > .col-sm-1, .rowSmall > .col-sm-2, .rowSmall > .col-sm-3, .rowSmall > .col-sm-4, .rowSmall > .col-sm-5, .rowSmall > .col-sm-6, .rowSmall > .col-sm-7, .rowSmall > .col-sm-8, .rowSmall > .col-sm-9, .rowSmall > .col-sm-10, .rowSmall > .col-sm-11 { padding-right: 5px; padding-left: 5px; }
.rowSmall > .col-md-1, .rowSmall > .col-md-2, .rowSmall > .col-md-3, .rowSmall > .col-md-4, .rowSmall > .col-md-5, .rowSmall > .col-md-6, .rowSmall > .col-md-7, .rowSmall > .col-md-8, .rowSmall > .col-md-9, .rowSmall > .col-md-10, .rowSmall > .col-md-11 { padding-right: 5px; padding-left: 5px; }
.rowSmall > .col-lg-1, .rowSmall > .col-lg-2, .rowSmall > .col-lg-3, .rowSmall > .col-lg-4, .rowSmall > .col-lg-5, .rowSmall > .col-lg-6, .rowSmall > .col-lg-7, .rowSmall > .col-lg-8, .rowSmall > .col-lg-9, .rowSmall > .col-lg-10, .rowSmall > .col-lg-11 { padding-right: 5px; padding-left: 5px; }


/* ----------------------------------------------------------------
	8. Button
-----------------------------------------------------------------*/


.btn-mod, a.btn-mod{
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
  padding:7px 25px;
  margin:0;
  color:#fff;
  background:#FF6B57;
  border:1px solid transparent;
  font-size:12px;
  font-weight:500;
  text-transform:capitalize;
  text-decoration:none;
  -webkit-border-radius:0;
  -moz-border-radius:0;
  border-radius:0;
}

.btn-mod-defult{
  -webkit-transition:all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  -moz-transition:all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  -o-transition:all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  -ms-transition:all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  transition:all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}

.btn-mod-defult:hover,
a.btn-mod-defult:hover{
  color:rgba(255,255,255, .85);
  background-color:rgba(0,0,0, .7);
  text-decoration:none;
  outline:none;
  border:1px solid transparent;
  border-color:transparent;
}

.btn-mod-defult:focus,
a.btn-mod-defult:focus{
  color:rgba(255, 255, 255, 1);
  background-color:rgb(185, 6, 6);
}

.btn-mod.btn-red{background:#fc4f4f}
.btn-mod.btn-onsenred{background:#E83928}
.btn-mod.btn-orange{background:#FF6B57}
.btn-mod.btn-yellow{background:#e69a2a}
.btn-mod.btn-green{background:#47b475}
.btn-mod.btn-skyblue{background:#32c5d2}
.btn-mod.btn-blue{background:#3498DB}
.btn-mod.btn-tirablue{background:#0098C5}
.btn-mod.btn-purple{background:#b771b0}

.btn-red{background:#fc4f4f;color:#fff}
.btn-skyblue{background:#32c5d2;color:#fff}
.btn-666{background:#666666;color:#fff}
.btn-red{background:#fc4f4f}
.btn-onsenred{background:#E83928}
.btn-orange{background:#FF6B57}
.btn-yellow{background:#e69a2a}
.btn-green{background:#47b475}
.btn-navergreen{background:#00bd39}
.btn-skyblue{background:#32c5d2}
.btn-blue{background:#3498DB}
.btn-tirablue{background:#0098C5}
.btn-purple{background:#b771b0}
.btn-white{ color:#111; border:1px solid rgba(0, 0, 0, .09); background:#fff}
.btn-fff{background:#fff; color:#111}
.btn-eee{background:#eee; color:#111}
.btn-ccc{background:#ccc}
.btn-999{background:#999}
.btn-666{background:#666}
.btn-333{background:#333}
.btn-111{background:#111}
.btn-000{background:#000}

.btn-white:hover, .btn-white:focus, a.btn-white:hover, a.btn-white:focus{border-color:transparent}
.btn-fff:hover, .btn-fff:focus, a.btn-fff:hover, a.btn-fff:focus,
.btn-eee:hover, .btn-eee:focus, a.btn-eee:hover, a.btn-eee:focus,
.btn-ccc:hover, .btn-ccc:focus, a.btn-ccc:hover, a.btn-ccc:focus,
.btn-999:hover, .btn-999:focus, a.btn-999:hover, a.btn-999:focus,
.btn-666:hover, .btn-666:focus, a.btn-666:hover, a.btn-666:focus,
.btn-333:hover, .btn-333:focus, a.btn-333:hover, a.btn-333:focus,
.btn-111:hover, .btn-111:focus, a.btn-111:hover, a.btn-111:focus,
.btn-000:hover, .btn-000:focus, a.btn-000:hover, a.btn-000:focus{
  color:#fff;
  background-color:#FF6B57;
}

.btn-red:hover{background-color:rgba(0, 0, 0,.7);color:#ffffff}
.btn-666:hover{background-color:#FF6B57;color:#ffffff}
.btn-skyblue:hover{background-color:#FF6B57;color:#ffffff}
.btn-red:focus{background-color:rgba(0, 0, 0,.7);color:#ffffff}
.btn-666:focus{background-color:#FF6B57;color:#ffffff}
.btn-skyblue:focus{background-color:#FF6B57;color:#ffffff}

/* Button-Size */
.btn-mod.btn-tiny{padding:1px 10px; font-size:11px; margin:0}
.btn-mod.btn-small{padding:3px 15px; font-size:11px; margin:0}
.btn-mod.btn-small i{font-size:11px !important}
.btn-mod.btn-vsmall{padding:5px 15px; font-size:11px; margin:0; font-size:12px}
.btn-mod.btn-medium{padding:10px 25px; font-size:14px; margin:0}
.btn-mod.btn-large{padding:18px 35px; font-size:14px; margin:0}
.btn-mod.btn-xlarge{padding:22px 55px; font-size:16px; margin:0}
.btn-mod.btn-xxlarge{padding:28px 80px; font-size:19px; margin:0}

@media only screen and (min-width:320px) and (max-width:479px){
  .btn-mod.btn-tiny{padding:1px 8px; font-size:11px; margin:0}
  .btn-mod.btn-small{padding:3px 12px; font-size:11px !important; margin:0}
  .btn-mod.btn-vsmall{padding:5px 10px; font-size:11px; margin:0; font-size:12px}
  .btn-mod.btn-medium{padding:8px 18px; font-size:14px; margin:0}
  .btn-mod.btn-large{padding:16px 20px; font-size:14px; margin:0}
  .btn-mod.btn-xlarge{padding:18px 35px; font-size:16px; margin:0}
  .btn-mod.btn-xxlarge{padding:18px 60px; font-size:19px; margin:0}
}


/* Button-Style */

.btn-mod.btn-round{
  -webkit-border-radius:3px;
  -moz-border-radius:3px;
  border-radius:3px;
}

.btn-mod.btn-circle{
  -webkit-border-radius:30px;
  -moz-border-radius:30px;
  border-radius:30px;
}
.btn-mod.btn-xxlarge.btn-circle{
	-webkit-border-radius:110px;
  -moz-border-radius:110px;
  border-radius:110px;
}
.btn-mod.btn-xlarge.btn-circle{
	-webkit-border-radius:80px;
  -moz-border-radius:80px;
  border-radius:80px;
}
.btn-mod.btn-large.btn-circle{
	-webkit-border-radius:50px;
  -moz-border-radius:50px;
  border-radius:50px;
}

.btn-mod.btn-3d{
  border-radius:3px;
  border-bottom:3px solid rgba(0,0,0,.15);
}

/* Button-Style 2 */

.btn-mod.btn-borderW{color:#eee; border:1px solid rgba(255, 255, 255, .3); background:rgba(255, 255, 255, .09)}
.btn-mod.btn-borderW2{color:#fff;border:2px solid rgba(255,255,255, .75);  background:transparent}
.btn-mod.btn-border{ color:#111;  border:1px solid rgba(0, 0, 0, .09);  background:transparent}
.btn-mod.btn-border2{ color:#111;  border:2px solid #111;  background:transparent}
.btn-mod.btn-border3{ color:#111;  border:1px solid #111;  background:transparent}
.btn-mod.btn-glass{  color:rgba(255,255,255, .75);  background:rgba(0,0,0, .40)}

.btn-borderW:hover, .btn-borderW:focus, a.btn-borderW:hover, a.btn-borderW:focus,
.btn-borderW2:hover, .btn-borderW2:focus, a.btn-borderW2:hover, a.btn-borderW2:focus,
.btn-border:hover, .btn-border:focus, a.btn-border:hover, a.btn-border:focus,
.btn-border2:hover, .btn-border2:focus, a.btn-border2:hover, a.btn-border2:focus,
.btn-666:hover, .btn-666:focus, a.btn-666:hover, a.btn-666:focus,
.btn-border3:hover, .btn-border3:focus, a.btn-border3:hover, a.btn-border3:focus,
.btn-glass:hover, .btn-glass:focus, a.btn-glass:hover, abtn-glass:focus{
  color:#fff;
  background-color:#FF6B57;
}

.btn-file{
  position:relative;
  overflow:hidden;
}
.btn-file input[type=file]{
  position:absolute;
  top:0;
  right:0;
  min-width:100%;
  min-height:100%;
  font-size:100px;
  text-align:right;
  filter:alpha(opacity=0);
  opacity:0;
  outline:none;
  background:white;
  cursor:inherit;
  display:block;
}

.i-gold{color:gold;text-shadow:0px 0px 1px #6f6a31}
.label-hot{background-color:#ea3f3f;padding:.1em .4em;font-size:8px;font-weight:400}

.btn-naver:hover, .btn-naver:focus, a.btn-naver:hover, a.btn-naver:focus{
  background-color:#23b300 !important;
  color:#fff;
}
.btn-kakao:hover, .btn-kakao:focus, a.btn-kakao:hover, a.btn-kakao:focus{
  background-color:#fbe300 !important; color:#340705 !important;
}
.btn-facebook:hover, .btn-facebook:focus, a.btn-facebook:hover, a.btn-facebook:focus{
  background-color:#3b5998 !important;
  color:#fff;
}
.btn-google:hover, .btn-google:focus, a.btn-google:hover, a.btn-google:focus{
  background-color:#dd4b38 !important;
  color:#fff;
}
.btn-instagram:hover, .btn-instagram:focus, a.btn-instagram:hover, a.btn-instagram:focus{
  background-color:#406f95 !important;
  color:#fff;
}



.areaTitle h3 { color:#fff; }