/* main common Start ================================================================================================================================================================= */
.align-start{align-items: flex-start !important;}
.main-title{font-family: 'GmarketSansMedium'; font-size: 2rem; font-weight: 500; line-height: 1.15; letter-spacing: normal; text-align: center; color: #000; text-transform: uppercase;}
.btn--common{width: 10rem; height: 3rem; background-color: #15568F;}
.btn--common span{font-family: 'GmarketSansMedium'; font-size: 0.9rem; font-weight: 500; letter-spacing: normal; text-align: center; color: #fff;}
.wrap{max-width: 1920px; width: 100%; margin: auto;}

/* datepicker Style */
.ui-datepicker { width: 270px; padding: 0; display: none; border: 0; margin-top: 10px;}
.ui-widget.ui-widget-content { border: 0; border-radius: 3px; overflow: hidden; background: #fff;}
.ui-datepicker .ui-widget-header { position: relative; padding: 6px 0 36px 0; border: 0; color: #000; border-radius: 0; }
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year { width: 70px; height: 26px; line-height: 26px; background: rgba(0,0,0,0.15) url("../img/main/arrow-button.png") 100% -27px no-repeat; margin: 0 4px; padding: 0 6px; border: 0; border-radius: 3px; color: #fff; font-size: 13px; font-weight: bold; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; appearance: none; /* 화살표 없애기 */ }
.ui-datepicker select.ui-datepicker-month:hover, .ui-datepicker select.ui-datepicker-year:hover { background: rgba(0,0,0,0.3) url("../img/main/arrow-button.png") 100% -27px no-repeat; }
.ui-datepicker select::-ms-expand {
    display: none; /* 화살표 없애기 for IE10, 11*/
}
.ui-datepicker .ui-datepicker-title { line-height: 1.8em; text-align: center; margin: 0px 2.3em; font-size:13px; font-weight:bold; letter-spacing:0; }
.ui-datepicker-title .ui-datepicker-year option, .ui-datepicker-title .ui-datepicker-month option { background: #fff; color: #333; }
.ui-datepicker-title .ui-datepicker-year {}
.ui-datepicker-title .ui-datepicker-month {}
.ui-datepicker .ui-datepicker-calendar { position: relative; width: 260px; margin: 0 auto; }
.ui-datepicker-calendar thead tr { position: absolute; top: -24px; left: 5px; right: 5px; }
.ui-datepicker-calendar thead th { float: left; display: block; padding: 0; width: 14.2857%; color: #000; font-size:11px; letter-spacing:1px; opacity: 0.6 }
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position: absolute; top: 5px; width: 1.8em; height: 1.8em; text-indent: -9999px; cursor: pointer; background-color: #ddd; }
.ui-datepicker .ui-datepicker-prev { left: 5px; }
.ui-datepicker .ui-datepicker-prev.ui-state-hover { background: rgba(0,0,0,0.1); border: 0; }
.ui-datepicker .ui-datepicker-prev .ui-icon { background: url("../img/main/arrow-button.png") 0 0 no-repeat; }
.ui-datepicker .ui-datepicker-next { right: 5px; }
.ui-datepicker .ui-datepicker-next.ui-state-hover { background: rgba(0,0,0,0.1); border: 0; }
.ui-datepicker .ui-datepicker-next .ui-icon { background: url("../img/main/arrow-button.png") -16px 0 no-repeat; }
.ui-datepicker .ui-state-default { display: block; border: 0; border-radius: 15px; width: 30px; height: 30px; line-height: 29px; padding: 0; margin: 4px auto; font-size: 12px; text-align: center; background: #fff; font-weight: normal; color: #333; box-sizing: border-box; }
.ui-datepicker .ui-state-default.ui-state-hover { background: rgba(0,0,0,0.05); }
.ui-datepicker-today .ui-state-default { color: #3f51b5; font-weight: bold; }
.ui-datepicker-current-day .ui-state-default { background: #15568F !important; color: #fff; font-weight: bold; }
.ui-datepicker-buttonpane { overflow: hidden; border-top: 1px solid #eee; }
.ui-datepicker-buttonpane button[data-handler="today"] { color: #3f51b5; opacity: 0.75; }
.ui-datepicker-buttonpane button[data-handler="hide"] { }

.ui-timepicker-standard{height: initial !important; padding: 0 !important;
                        font-size: 0.8rem !important; font-family: 'NanumSquare', sans-serif !important;}
.ui-timepicker-standard a{color: #999 !important; padding: 0.5rem !important;}

/* ie add Style */
.ui-datepicker td, .ui-datepicker th { border: 0 }
.ui-datepicker .ui-datepicker-buttonpane button { float: right; cursor: pointer; width: auto; margin: 0.5em 0.2em 0.4em; padding: 0.2em 0.6em 0.3em; overflow: visible; }
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float: left; }
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; }
.ui-corner-all { border-radius: 3px; }
.ui-icon { display: block; width: 16px; height: 16px; }

.date_pick {flex: initial !important; width: 70%;}
.date_pick .calendar {height:100%; margin-bottom:1rem; text-align:center;}
.date_tab {display:flex;}
.date_tab li {width:50%; padding:0.75rem 0px; background:#fff; border:1px solid #e6e6e6; text-align:center; cursor:pointer;}
.date_tab li.active {background:#15568F; color:#fff;}
.date_tab li .title{font-size: 0.8rem;}

.date_tab li input {border:0px; background:transparent;}

.inline_calendar {width:100%;}
.inline_calendar .ui-datepicker {width:100%; margin-top:0px;}


/* mobile Responsive */
 @media screen and (max-width:480px) {
    .choice-form{flex-direction: column;}
    .choice-form--title{margin-top: 1rem;}
    .date_tab li .title{font-size: 0.7rem !important;}
    .date_pick{width: 100% !important; margin-top: 1rem;}
}

/* main common End ================================================================================================================================================================= */


/* .main-sectio01 ================================================================================================================================================================= */
.main-sectio01{width: 100%; height: 49rem;}
.main-sectio01 .swiper{ height: 100%;}
.slide01{background: url('../img/main/visual_01.jpg') no-repeat center/cover;}
.slide02{background: url('../img/main/visual_02.jpg') no-repeat center/cover;}
.slide03{background: url('../img/main/visual_03.jpg') no-repeat center/cover;}
.slide04{background: url('../img/main/visual_04.jpg') no-repeat center/cover;}
.slide05{background: url('../img/main/visual_05.jpg') no-repeat center/cover;}
.slide06{background: url('../img/main/visual_06.jpg') no-repeat center/cover;}
.swiper-button-next, .swiper-button-prev{color: #fff !important;}
.main-slider__scroll{position: absolute; left:50%; bottom: 2.25rem; z-index: 1; transform: translate(-50%,0); display: flex; flex-direction: column; align-items: center;}
.main-slider__scroll img{width:3px; height:46px;}
.main-slider__scroll a{margin-top: 0.8rem; font-family: 'NEXON Lv2 Gothic Bold'; font-size: 0.6rem; line-height: 1.08; letter-spacing: 1.2px; text-align: center; color: #fff;}

/* .main-sectio02 ================================================================================================================================================================= */
.main-sectio02{width: 100%; margin: auto; background-color: #DCC1B0; padding: 6rem 0; box-sizing: border-box;} 
/*.main-sectio02 .inner-md{display: flex; justify-content: space-between; position: relative; align-items: center; height: 42rem;}*/
.main-sectio02 .inner-md{display: flex; justify-content: space-between; position: relative; align-items: center;}
/*.main-sectio02 .inner-md::before{content: ""; position: absolute; top: 3rem; left: 15rem; width: 0.3rem; height: 6rem; background-color: #000;}*/
.section02__text-wrap{position: relative; width: 19.1rem;}
.section02__text-wrap img{width: 100%;}
.section02__text-wrap p{position:relative; margin-top: 2.5rem; padding-left: 1.4rem; font-family: 'GmarketSansLight'; font-size: 0.9rem; font-weight: 300; line-height: 1.67; letter-spacing: normal; text-align: left; color: #000;}
.section02__text-wrap p::before{content: ""; position: absolute; left: 0; width: 3px; height: 4rem; background-color: #000;}
.section02_img-wrap{width: 30rem; height: 42rem; background: url('../img/main/about_02.png') no-repeat; background-size: cover;}
/* .section02_img-wrap img{width: 100%;} */
.main-sectio02 .sub01-01__text__contents li img{max-width: 382px;}

/* .main-sectio03 ================================================================================================================================================================= */
.main-sectio03{width: 100%; background-color: #fff;}
.section03__project-gallery{display: flex;}
.section03__project-gallery li{margin-right: 1rem; cursor: pointer; overflow: hidden;}
.section03__project-gallery li:hover img{transform: scale(1.1); transition: all .5s;}
.section03__project-gallery li:last-child{margin-right: 0;}

/* .main-sectio04 ================================================================================================================================================================= */
.main-sectio04{width: 100%; background-color: #fafafa;}
.contact-form{max-width: 40rem; width: 95%; margin: auto; border-top: 2px solid #000;}
.contact-form label{width: 100%; display: flex; align-items: center; margin-bottom: 0.5rem;}
.contact-form label:last-child{margin-bottom: 0;}
.contact-form label div{flex: 1; font-size: 0.8rem; font-weight: 400; letter-spacing: normal; text-align: left; color: #000;}
.contact-form label div .dot{font-weight: 800;}
.contact-form label input{width: 70%; height: 2.5rem; border: 0; font-size: 0.8rem; text-indent: 1rem; color: #999;}
.contact-form label input::placeholder{font-size: 0.8rem; letter-spacing: normal; text-align: left; color: #999;}
.contact-form label textarea{width: 70%; height: 7.5rem; border: 0; font-size: 0.8rem; text-indent: 1rem; padding-top: 1rem; resize: none;}
.contact-form__btn{text-align: center; border-top: 2px solid #000;}
.contact-form__btn button{border: 1px solid #15568F;}
.date{width: 100%; position: relative;}

.contact-form label.label--explain{align-items: flex-start;}
input[type="email"]:focus, input[type="tel"]:focus, input[type="number"]:focus, input[type="time"]:focus, input[type="date"]:focus{outline: 1px solid #999; transition: all 0.30s ease-in-out;}


@media (max-width:1024px) {
    .main-sectio02 .inner-md{flex-direction: column;}
    .main-sectio02 .inner-md::before{display: none;}
    .section02_img-wrap{ margin-top: 2.5rem; background-position: center;}
    .main-sectio02 .sub01-01__text__contents li img{max-width: 250px;}
    .main-sectio02 .sub01-01__text__contents li:nth-child(2){margin-left: 80px; margin-right: 0;}
}

@media (max-width:759px) {
    .section02__text-wrap{display: flex; flex-direction: column; align-items: center;}
    .section02__text-wrap img{width: 65%;}
    .section02_img-wrap{width: 95%;}
    .main-sectio02 .sub01-01__text__contents{flex-direction: column; align-items: center;}
    .main-sectio02 .sub01-01__text__contents li img{max-width: 200px; width: 95%;}
    .main-sectio02 .sub01-01__text__contents li:nth-child(2){margin-left: 0px; margin-right: 0; text-align: center; margin-top: 25px;}

    .main-sectio03{padding: 4rem 0;}
    .section03__project-gallery {flex-wrap: wrap; margin-top: 0;}
    .section03__project-gallery li{width: 49%; margin-right: 1%; margin-bottom: 1%;}
    .section03__project-gallery li:hover img{transform: scale(1); transition: all .5s;}

    .main-sectio04{padding: 4rem 0;}
}

@media (max-width: 659px) {
    .toggle-mobile{font-size: 1.4rem;}
    .main-sectio01{height: calc(100vh - 80px);}

    .contact-form label input{width: 70%;}
    .contact-form label textarea{width: 70%;}
}