/* http://meyerweb.com/eric/tools/css/reset/ 
v2.0 | 20110126
License: none (public domain)
*/

* {box-sizing: border-box;}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit;
vertical-align: baseline; }
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }

.container {max-width: 1200px; margin: 0 auto; position: relative; padding-left: 15px; padding-right: 15px;}
.container.sm {max-width: 1000px;}
.row:after,
.clearfix:after {content: ''; display: block; clear:both;}
.absolute-center {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%)}
.slide { height: 100vh;  background-repeat: no-repeat;  background-size: cover;  background-position: center; position: relative; overflow: hidden}
.slide .layer {position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 10}
.slide img {max-width: 100%;}

.slide01 {background-image: url("../images/s01-bg.jpg"); background-size: auto 100%; background-position: top center}
.slide01 .row {padding: 0 15px;}
.slide01 .layer-01 {margin: 120px auto;}
.slide01 .upper {position: absolute; top: 0; left: 0; right: 0; min-width: 250px;}
.slide01 .upper .item {;}
.slide01 .typo-01 {float: left; padding-right: 15px;}
.slide01 .typo-02 {float: right; margin: 11px 0; padding-left: 15px; text-align: right}
.slide01 .lower {position: absolute; bottom: 0; left: 0; right: 0; text-align: center; }


.slide02 {background-image: url("../images/s02-bg-dodge.jpg");}
.slide02 .layer-02 {z-index: 12}
.slide02 .layer-02 > .item {position: absolute; right: 0; bottom: -2px; width: 35%; padding-right: 30px; text-align: right}
.slide02 .layer-01 {z-index: 11; }
.slide02 .layer-03 {bottom: 0; top: inherit; z-index: 14}
.slide02 .layer-03 > .item,
.slide02 .layer-01 > .item {width: 65%;}
.slide02 .layer-01 .typo-01 {margin: 100px 0}
.slide02 .lower .column {float: left; padding-right: 15px; font-size: 22px}
.slide02 .lower > .column.left {width: 65%; float: left}
.slide02 .lower > .column.right {width: 35%; margin: 23px 0; float: right}
.slide02 .lower .info-place .column.left {text-align: left; width: 60%; margin: 3px 0;}
.slide02 .lower .info-place .column.right {text-align: left; width: 40%}
.slide02 .lower .info-place .content {font-weight: 900; background-repeat: no-repeat; background-position: left top; background-size: auto 100%}
.slide02 .lower .info-place .ico-phone {background-image: url("../images/ico-phone.png"); padding-left: 1.2em;}
.slide02 .lower .info-place .ico-kakao {background-image: url("../images/ico-kakao.png"); padding-left: 1.6em}
.slide02 .lower > .column.right .content h3 {font-size: 1em; font-weight: 900; margin-bottom: 10px}
.slide02 .lower > .column.right .content p {font-size: 0.8em; margin-bottom: 5px}
.slide02 .lower .row {margin: 20px 0;}
.slide02 .lower .btn-place {text-align: center; }
.slide02 .lower .btn-place img {width: 10em}
.slide03 {background-image: url("../images/s03-bg.jpg")}
.slide03 .layer-01 {margin: 120px auto;}
.slide03 .column {float: left}
.slide03 .column.left {text-align: left; width: 42%; padding-right: 15px; margin-top: 18px;}
.slide03 .column.right {text-align: right; width: 58%; padding-left: 15px}
.slide03 .row {margin: 30px 0;}
.slide03 .image-01 {border: 7px solid #fff; border-radius: 10px;}

.slide04 {background-image: url("../images/s04-bg.jpg")}
.slide04 .layer-01 .item {text-align: center; width: 60%; padding: 0 15px}


.slide05 {background-image: url("../images/s05-bg.png"); background-position: top center; background-size: auto 110%; }
.slide05 .content {width: 100%; max-width: 800px; padding: 0 15px;}
.slide05 .layer-01 .content > .row {margin: 50px 0;}
.slide05 .gallery .item {float: left; width: 50%; padding: 5px;}
.slide05 .gallery .item img {width: 100%;}
.slide05 .typo {text-align: center;}
.slide05 .typo .row {margin: 30px 0;}

.slide06 {background-image: url("../images/s06-bg.jpg")}
.slide06 .layer-01 {max-width: 1300px;}
.slide06 .layer-01 > .content {width: 100%; padding: 0 15px;}
.slide06 .layer-01 > .content > .row {margin: 50px 0;}
.slide06 .typo .item {text-align: center; margin: 15px 0;}
.slide06 .gallery .item {float: left; width: 25%; padding: 5px; }
.slide06 .gallery .item img {border-radius: 5px; box-shadow: 1px 1px 1px rgba(0,0,0,0.4)}


.slide07 {
    background-image: url("../images/s07-bg-02.png"), url("../images/s07-bg-01.jpg");
    background-position: bottom center, top center;
    background-size: 100% auto, 110%;
}
.slide07 .container {max-width: 1000px;}
.slide07 .upper,
.slide07 .midd,
.slide07 .lower {margin: 50px 0;}
.slide07 .upper {margin-bottom: -4%; }
.slide07 .upper img {max-height: 100%}
.slide07 .upper .item {margin: 20px 0}
.slide07 .upper .item.typo-01 {margin-left: -3.1%;}
.slide07 .midd {;}
.slide07 .lower {text-align: center; width: 50%; margin: 0 auto;}
.slide07 .lower .item {margin: 20px 0;}

.slide08 {background-image: url("../images/s08-bg.jpg")}
.slide08 .content {width: 100%; padding: 0 15px;}
.slide08 .row {text-align: center; margin: 80px 0;}
.slide08 .typo-01 {max-width: 60%; margin: 0 auto;}

.slide09 {background-image: url("../images/s09-bg.jpg"); background-position: top right 20%}
.slide09 .content {width: 100%; padding: 0 15px;}
.slide09 .layer-01 {text-align: center; max-width: 900px}
.slide09 .layer-01 .row {margin: 100px 0;}

.slide10 {background-color: #383eaa}
.slide10 .content {width: 100%;}
.slide10 .typo {width: 60%; }
.slide10 .row {text-align: center; margin: 80px auto}

.slide11 {background-image: url("../images/s11-bg.jpg")}
.slide11 .layer-01 {z-index: 11}
.slide11 .layer-02 {z-index: 10}
.slide11 .typo-01 {text-align: center; margin: 100px 0;}
.slide11 .image-01 {position: absolute; left: 0; right: 0; bottom: -8%;}

footer {position: absolute; bottom: 0; background-color: #fff; left: 0; right: 0; max-height: 0; transition: all 0.1s}
footer img {max-width: 100%;}
footer .column {float: left}
footer .column.logo {width: 27%; text-align: left; margin: 19.5px 0}
footer .column.info {width: 25%; padding: 0 15px;}
footer .column.license {width: 21%; padding: 0 15px; margin: 1.5px 0}
footer .column.email {width: 27%; text-align: right; margin: 26.5px 0}
footer .column.info .item {margin: 10px 0;}

footer.show {padding: 20px 0; max-height: 500px}


@media (max-width: 1000px) {
    .slide02 .lower .column {font-size: 18px}
    .slide07 .upper .item.typo-01 {margin-left: 0;}
    .slide07 {background-size: 100% auto, 150%;}
    
}

@media (max-width: 800px) {
    .slide01 .upper {width: 50%; margin: 0 auto;}
    .slide01 .upper .item {padding: 0; margin: 10px 0; text-align: center; float: none;}
    
    .slide02 .layer-03 > .item {width: 70%;}
    .slide02 .layer-01 > .item {width: 100%;}
    .slide02 .layer-02 > .item {width: 30%}
    
    .slide03 .column {margin: 10px 0;}
    .slide03 .column.left {width: 100%; float: none; padding: 0; text-align: left}
    .slide03 .column.right {width: 100%; float: none; padding: 0; text-align: left}
    
    .slide04 .layer-01 .item {width: 80%}
    
    .slide07 {background-size: 100% auto, 200%;}
}

@media (max-width: 650px) {
    .slide02 .layer-03 > .item {width: 100%;}
    .slide02 .layer-01 > .item {width: 100%;}
    .slide02 .layer-02 {display: none;}
    .slide02 .lower > .column.left {width: 50%;}
    .slide02 .lower > .column.right {width: 50%}
    .slide02 .lower .btn-place {text-align: left}
    .slide02 .lower .info-place .column {margin: 10px 0}
    .slide02 .lower .info-place .column.left {width: 100%; text-align: left}
    .slide02 .lower .info-place .column.right {width: 100%; text-align: left}
    
    .slide04 .layer-01 .item {width: 100%}

    .slide06 .gallery .item {width: 50%;}
    
    .slide07 .lower {width: 100%}

    .slide11 .image-01 {top: 50%;}
    footer .column.logo {width: 50%;}
    footer .column.info {width: 50%;}
    footer .column.license {width: 50%}
    footer .column.email {width: 50%;}
}

@media (max-width: 480px) {
    .slide02 .lower > .column.right,
    .slide02 .lower > .column.left {width: 100%; text-align: center; margin: 10px; padding: 0; float: none}
    .slide02 .lower .btn-place,
    .slide02 .lower .info-place .column.left,
    .slide02 .lower .info-place .column.right {text-align: center;}
    .slide02 .lower .info-place .ico-phone,
    .slide02 .lower .info-place .ico-kakao {display: inline-block;}
    .slide02 .lower .row {margin: 10px 0}
    .slide02 .lower .column {padding: 0}

    .slide11 .image-01 {text-align: center;}
    .slide11 .image-01 img {transform: translateX(-50%) scale(2, 2); margin-left: 50%}
}