@charset "UTF-8";
html {line-height: 1.15;-webkit-text-size-adjust: 100%;}
body {margin: 0;}
main {display: block;}
h1 {font-size: 2em;margin: 0.67em 0;}
hr {box-sizing: content-box;height: 0;overflow: visible;}
pre {font-family: monospace, monospace;font-size: 1em;}
a {background-color: transparent;}
abbr[title] {border-bottom: none;text-decoration: underline;text-decoration: underline dotted;}
b,strong {font-weight: bolder;}
code,kbd,samp {font-family: monospace, monospace;font-size: 1em;}
small {font-size: 80%;}
sub,sup {font-size: 75%;line-height: 0;position: relative;vertical-align: baseline;}
sub {bottom: -0.25em;}
sup {top: -0.5em;}
img {border-style: none;}
button,input,optgroup,select,textarea {font-family: inherit;font-size: 100%;line-height: 1.15;margin: 0;}
button,input {overflow: visible;}
button,select {text-transform: none;}
button,[type="button"],[type="reset"],[type="submit"] {-webkit-appearance: button;}
button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {border-style: none;padding: 0;}
button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring {outline: 1px dotted ButtonText;}
fieldset {padding: 0.35em 0.75em 0.625em;}
legend {box-sizing: border-box;color: inherit;display: table;max-width: 100%;padding: 0; white-space: normal;}
progress {vertical-align: baseline;}
textarea {overflow: auto;}
[type="checkbox"],[type="radio"] {box-sizing: border-box;padding: 0;}
[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button {height: auto;}
[type="search"] {-webkit-appearance: textfield;outline-offset: -2px;}
[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}
::-webkit-file-upload-button {-webkit-appearance: button;font: inherit;}
details {display: block;}
summary {display: list-item;}
template {display: none;}
[hidden] {display: none;} body {font-family:'A1 Mincho','游明朝','YuMincho','ヒラギノ明朝 Pro W3', 'HiraMinPro-W3','ヒラギノ明朝 ProN W3', 'HiraMinProN-W3','HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'MS 明朝', serif;font-weight: 400;}
.gothic {font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3','メイリオ',Meiryo,'游ゴシック','YuGothic',sans-serif;} body {font-size:14px;line-height:1.8em;margin: 0;padding: 0;overflow-x: hidden;}
.cf:before,.cf:after {content:"";display:table;}.cf:after {clear:both;}.cf {zoom:1;}
.trans { transition:all 0.5s ease;-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;-ms-transition:all 0.5s ease;}
.nowrap {overflow: hidden;-o-text-overflow: ellipsis;-webkit-text-overflow: ellipsis;text-overflow: ellipsis;white-space: nowrap;}
.cover { background-size: cover; background-position: center; background-repeat: no-repeat;-webkit-background-size: cover;-moz-background-size: cover;-ms-background-size: cover;}
.contain { background-size: cover; background-position: center; background-repeat: no-repeat;-webkit-background-size: contain;-moz-background-size: contain;-ms-background-size: contain;}
.bold { font-weight:bold;}
.text-center {text-align: center;}
.text-left {text-align: left;}
.text-right {text-align: right;}
.radius {border-radius: 3px;-webkit-border-radius: 3px;-moz-border-radius: 3px;-o-border-radius: 3px;-ms-border-radius: 3px;}
hr {border-top: 1px solid #eee;margin: 0 0 75px;padding: 0;}
a {text-decoration: none;}
a:hover {text-decoration: none;}
a.alpha img{filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0;transition:opacity 0.5s ease;-webkit-transition:opacity 0.3s ease;-moz-transition:opacity 0.3s ease;-o-transition:opacity 0.3s ease;-ms-transition:opacity 0.3s ease;}
a.alpha:hover img {filter:alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6;}
figure {margin: 0;padding: 0;display: block;}
figure img { width:100%;height:auto;}
ul {margin: 0;padding: 0; list-style: none;}
ul li {margin: 0;padding: 0;display: block;line-height: 0;box-sizing: border-box;-webkit-box-sizing: border-box;}
h1,h2,h3,h4,h5,p {margin: 0;padding: 0;font-weight: normal;font-size: 14px;}
div,p,span {box-sizing: border-box;-webkit-box-sizing: border-box;}
.video {position: relative;width: 100%;height: 0;padding-bottom: 56.25%;overflow: hidden;} .video43 {position: relative;width: 100%;height: 0;padding-bottom: 75%;overflow: hidden;} .video iframe,
.video43 iframe {width: 100%;height: 100%;position: absolute;top: 0;left: 0;} .btn.std {width: 400px;display: block;height:80px; text-align:center;cursor:pointer;position:relative;box-sizing:border-box;overflow:hidden;background-color:#504C44;}
.btn.std a {font-family: 'Playfair Display', serif;font-weight:400;padding-left: 50px;text-align: left;letter-spacing:2px;font-size:16px;color:#FFF;text-decoration:none;line-height:80px;z-index:2;position:relative; display: block;transition:all .3s ease;-webkit-transition:all .3s ease;}
.btn.std a span {height: 1px; width: 50px;display: block; background-color: #fff; position: absolute; top: 58%;left:300px;transition:all .3s ease;-webkit-transition:all .3s ease;}
.btn.std a span::before {content: '';height: 1px; width: 10px;display: block;transform: rotate(45deg); position: absolute; top: -4px;right:-1px; background-color: #fff;}
.btn.std::before {content:'';width:100%;height:100%;left:-100%;background:rgba(0,0,0,0.25);position:absolute;transition:all .3s ease;-webkit-transition:all .3s ease;left:100;}
.btn.std:hover::before {left:0;}
.btn.std:hover a span {width: 70px;}
@media screen and (max-width: 767px) {
.btn.std {height:50px;width: auto;}
.btn.std a {font-size:13px;line-height:50px;padding-left: 20px;}
.btn.std a .fa { line-height:50px; font-size: 18px;right: 20px;}
.btn.std a span {font-size:10px;margin-left: 15px;left: 150px;width: 50px;}
.btn.std:hover a span {width: 70px;}
}
.btn.more {width:100%;max-width: 150px;margin: 0 auto;display: block;height:40px; text-align:center;cursor:pointer;position:relative;box-sizing:border-box;overflow:hidden;background-color:#000;}
.btn.more a {font-family: 'Playfair Display', serif;font-weight:400;text-align: center;letter-spacing: 1px;font-size:14px;color:#FFF;text-decoration:none;line-height:40px;z-index:2;position:relative; display: block;transition:all .3s ease;-webkit-transition:all .3s ease;}
.btn.more a .fa { line-height:39px; font-size: 18px;right: 15px;position: absolute; top: 0;}
.btn.more::before {content:'';width:100%;height:100%;left:-100%;background:#504C44;position:absolute;transition:all .3s ease;-webkit-transition:all .3s ease;left:100;}
.btn.more:hover::before {left:0;}
@media screen and (max-width: 767px) {
.btn.more {height:30px;max-width: auto;}
.btn.more a {font-size:13px;line-height:30px;padding-left: 0px;}
.btn.more a .fa { line-height:30px; font-size: 18px;right: 20px;}
.btn.more a span {font-size:10px;margin-left: 15px;}
}
.btn.morewh {width:100%;max-width: 150px;margin: 0 auto;display: block;height:40px; text-align:center;cursor:pointer;position:relative;box-sizing:border-box;overflow:hidden;background-color:#FFF;border: 1px solid #ddd;transition:all .3s ease;-webkit-transition:all .3s ease;}
.btn.morewh a {font-family: 'Playfair Display', serif;font-weight:400;text-align: center;letter-spacing: 1px;font-size:14px;color:#000;text-decoration:none;line-height:38px;z-index:2;position:relative; display: block;transition:all .3s ease;-webkit-transition:all .3s ease;}
.btn.morewh::before {content:'';width:100%;height:100%;left:-100%;background:#504C44;position:absolute;transition:all .3s ease;-webkit-transition:all .3s ease;left:100;}
.btn.morewh:hover::before {left:0;}
.btn.morewh:hover {border: 1px solid #504C44;}
.btn.morewh a:hover {color: #fff;}
@media screen and (max-width: 767px) {
.btn.morewh {height:40px;}
.btn.morewh a {font-size:13px;line-height:40px;padding-left: 20px;}
.btn.morewh a .fa { line-height:40px; font-size: 18px;right: 20px;}
.btn.morewh a span {font-size:10px;margin-left: 15px;}
} .table {border-collapse: collapse;border-spacing: 0; }
.table {font-size: 16px;border-bottom: 1px solid #ddd;border-right: 1px solid #ddd;background-color: #fff;}
.table {margin: 0;padding: 0;}
.table tr th,
.table tr td {outline:none;border-top: 1px solid #ddd;border-left: 1px solid #ddd;padding: 15px 20px; background-color: transparent;line-height: 2em;vertical-align: middle;}
.table tr th {font-weight: bold;}
.table thead { background-color: rgba(0,159,232,0.5);}
.table tr td.price {font-weight: bold; text-align: center;color: #E356BB;}
@media screen and (max-width: 767px) {
.table {font-size: 13px;}
.table tr th,
.table tr td {padding: 10px 15px;line-height: 1.6em;}
} #scrlTop {text-align: center; line-height: 45px;z-index: 999;opacity: 0;height: 40px; width: 40px; position: fixed; bottom: 100px; right: 100px; background-color: #504C44; -webkit-transition: all .5s ease;transition: all .5s ease;}
#scrlTop .fa { color: #fff; font-size: 24px; cursor: pointer;}
#scrlTop.on {opacity: 1;-webkit-transition: all .5s ease;transition: all .5s ease;cursor: pointer;display:block;}
#scrlTop.on:hover { background-color:#D0C5B0;}
#scrlTop.on:hover .fa {color: #000;}
@media screen and (max-width: 768px) {
#scrlTop {line-height: 45px;height: 40px; width: 40px; position: fixed; bottom: 25px; right: 25px;}
#scrlTop.on.hover { opacity: 0.5;}
}
.row {}
.row ul {font-size: 0;margin: 0 -25px;}
.row ul:before,.row ul:after {content:"";display:table;}.row ul:after {clear:both;}.row ul {zoom:1;}
.row ul.col-3 li {width: 33.33%;display:inline-block;box-sizing: border-box;-webkit-box-sizing: border-box;padding:50px;}
.row ul.col-4 li {width: 25%;display:inline-block;box-sizing: border-box;-webkit-box-sizing: border-box;padding:50px;}
@media screen and (max-width: 1280px) {
.row ul {font-size: 0;margin: 0 -30px;}
.row ul.col-3 li {padding:30px;}
}
@media screen and (max-width: 768px) {
.row ul {font-size: 0;margin: 0 -15px;}
.row ul.col-3 li {width: 50%;display:inline-block;box-sizing: border-box;-webkit-box-sizing: border-box;padding:15px;}
} .formWrap {font-size: 14px;color: #FFF;}
.formWrap dl {display: block;margin: 0;padding: 0;padding-top: 0px;}
.formWrap dl dt {width: 35%;margin: 0;padding: 0;float: left;display: block; text-align: right;}
.formWrap dl dt .label {padding-right: 50px; line-height: 50px;font-size: 16px;}
.formWrap dl dt .label span {margin-right: 5px;color:#D8B676;}
.formWrap dl dd {width: 65%;margin: 0;padding: 0;float: left;display: block;margin-bottom: 25px;}
.formWrap input[type="text"],
.formWrap input[type="email"],
.formWrap input[type="tel"]{box-sizing: border-box;width: 100%;border: 1px solid #FFF;background-color: #FFF; color: #000!important; font-size: 14px; line-height:50px;padding: 0 20px;border-radius: 3px;-webkit-border-radius: 3px;}
.formWrap textarea {box-sizing: border-box;width: 100%;border: 1px solid #FFF;background-color: #FFF; color: #000!important; font-size: 14px; line-height:1.8em;padding: 20px;border-radius: 3px;-webkit-border-radius: 3px;}
.formWrap input[type="text"]:focus,
.formWrap input[type="email"]:focus,
.formWrap input[type="tel"]:focus,
.formWrap textarea:focus {border: 1px solid #ccc;outline: 0;}
.formWrap input[type="checkbox"] {margin-right: 10px; line-height:100px;padding: 0 20px;border-radius: 3px;-webkit-border-radius: 3px;border: #666;color: #fff;}
.formWrap input::placeholder {color:#999;}
.formWrap textarea::placeholder {color:#999;}
.formWrap .policy { font-size: 12px;background-color: #FFF;color: #000;padding: 20px;height: 100px;display: block;overflow: scroll; line-height: 1.6em;margin-bottom: 25px;border-radius: 5px;-moz-border-radius: 5px;-webkit-border-radius: 5px;-o-border-radius: 5px;-ms-border-radius: 5px;}
.formWrap .policy h3 { font-size: 13px; text-align: center; font-weight: bold; margin-bottom: 10px;}
.formWrap .btnGrp {width: 100%; border-top: 1px solid #ccc;padding-top: 25px;}
.formWrap .btnGrp ul {text-align: center; font-size: 0;}
.formWrap .btnGrp ul li {font-size: 16px;display: inline-block;box-sizing: border-box;padding: 10px;width: auto;}
.formWrap .btnGrp ul li input[type=button],
.formWrap .btnGrp ul li input[type=submit] { letter-spacing: 1px;font-size: 16px;height: 50px;line-height: 50px;width: 300px;display: inline-block;border:none;color: #FFF;transition:all 0.3s;-webkit-transition:all 0.3s;border-radius: 3px;-webkit-border-radius: 3px;}
.formWrap .btnGrp ul li input[type=button] {background-color: #90897A;}
.formWrap .btnGrp ul li input[type=submit] {background-color: #DDD1BB; color: #504C44;}
.formWrap .btnGrp ul li input[type=button]:hover { background-color: #90897A;}
.formWrap .btnGrp ul li input[type=submit]:hover { background-color: #DDD1BB; color: #504C44;}
div.wpcf7-mail-sent-ok {border: 2px solid #DDD1BB!important;background-color: #fff;margin: 40px 100px 0!important;}
div.wpcf7-mail-sent-ng {border: 2px solid #DDD1BB!important;background-color: #fff;margin: 40px 100px 0!important;}
div.wpcf7-spam-blocked {border: 2px solid #DDD1BB!important;background-color: #fff;margin: 40px 100px 0!important;}
div.wpcf7-validation-errors {border: 2px solid #DDD1BB!important;background-color: #fff;margin: 40px 100px 0!important;}
@media screen and (max-width: 768px) {
.formWrap {font-size: 14px;}
.formWrap dl {display: block;margin: 0;padding: 0 25px;}
.formWrap dl dt {width: 100%;float: none;text-align: left;box-sizing: border-box;-webkit-box-sizing: border-box;}
.formWrap dl dt .label {padding-right: 0px; line-height: 50px;padding-left: 15px;}
.formWrap dl dt .label span {margin-right: 5px;color: red;}
.formWrap dl dd {width: 100%;float: none;margin-bottom: 15px;box-sizing: border-box;-webkit-box-sizing: border-box;}
.formWrap .btnGrp ul {margin: 0px 25px;}
.formWrap .btnGrp ul li {display: block;width: 100%;box-sizing: border-box;padding: 0px;margin-bottom: 10px;}
}
@media screen and (max-width: 767px) {
.formWrap {font-size: 12px;}
.formWrap dl {padding:0px;}
.formWrap dl dt .label {padding-left: 10px; font-size: 12px;}
.formWrap dl dd {width: 100%;float: none;margin-bottom: 10px;box-sizing: border-box;-webkit-box-sizing: border-box;}
.formWrap .btnGrp ul {margin: 0;}
.formWrap .btnGrp ul li {display: block;width: 100%;box-sizing: border-box;padding: 0px;margin-bottom: 10px;}
.formWrap .btnGrp ul li input[type=button],
.formWrap .btnGrp ul li input[type=submit] { letter-spacing: 1px;font-size: 16px;height: 50px;line-height: 50px;width:100%;}
div.wpcf7-mail-sent-ok {border: 2px solid #DDD1BB!important;background-color: #fff;margin: 20px 20px 0!important;}
div.wpcf7-mail-sent-ng {border: 2px solid #DDD1BB!important;background-color: #fff;margin: 20px 20px 0!important;}
div.wpcf7-spam-blocked {border: 2px solid #DDD1BB!important;background-color: #fff;margin: 20px 20px 0!important;}
div.wpcf7-validation-errors {border: 2px solid #DDD1BB!important;background-color: #fff;margin: 20px 20px 0!important;}
}.vbox-overlay *, .vbox-overlay *:before, .vbox-overlay *:after{
-webkit-backface-visibility: hidden;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
.vbox-overlay{
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: center;
align-items: center;
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
z-index: 999999;
-webkit-transform:translateZ(1000px);
transform: translateZ(1000px);
transform-style: preserve-3d;
} .vbox-title{
width: 100%;
height: 40px;
float: left;
text-align: center;
line-height: 28px;
font-size: 12px;
padding: 6px 40px;
overflow: hidden;
position: fixed;
display: none;
left: 0;
z-index: 1050;
}
.vbox-close{
cursor: pointer;
position: fixed;
top: -1px;
right: 0;
width: 50px;
height: 40px;
padding: 6px;
display: block;
background-position:10px center;
overflow: hidden;
font-size: 24px;
line-height: 1;
text-align: center;
z-index: 9999999;
}
.vbox-num{
cursor: pointer;
position: fixed;
left: 0;
height: 40px;
display: block;
overflow: hidden;
line-height: 28px;
font-size: 12px;
padding: 6px 10px;
display: none;
z-index: 9999999;
} .vbox-next, .vbox-prev{
position: fixed;
top: 50%;
margin-top: -15px;
overflow: hidden;
cursor: pointer;
display: block;
width: 45px;
height: 45px;
z-index: 9999999;
}
.vbox-next span, .vbox-prev span{
position: relative;
width: 20px;
height: 20px;
border: 2px solid transparent;
border-top-color: #B6B6B6;
border-right-color: #B6B6B6;
text-indent: -100px;
position: absolute;
top: 8px;
display: block;
}
.vbox-prev{
left: 15px;
}
.vbox-next{
right: 15px;
}
.vbox-prev span{
left: 10px;
-ms-transform: rotate(-135deg);
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg);
}
.vbox-next span{
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
right: 10px;
} .vbox-inline{
width: 420px;
height: 315px;
height: 70vh;
padding: 10px;
background: #fff;
margin: 0 auto;
overflow: auto;
text-align: left;
} .venoframe{
max-width: 100%;
width: 100%;
border: none;
width: 100%;
height: 260px;
height: 70vh;
}
.venoframe.vbvid{
height: 260px;
}
@media (min-width: 768px) {
.venoframe, .vbox-inline{
width: 90%;
height: 360px;
height: 70vh;
}
.venoframe.vbvid{
width: 640px;
height: 360px;
}
}
@media (min-width: 992px) {
.venoframe, .vbox-inline{
max-width: 1200px;
width: 80%;
height: 540px;
height: 70vh;
}
.venoframe.vbvid{
width: 960px;
height: 540px;
}
} .vbox-open{
overflow: hidden;
}
.vbox-container{
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
overflow-x: hidden;
overflow-y: scroll;
overflow-scrolling: touch;
-webkit-overflow-scrolling: touch;
z-index: 20;
max-height: 100%;
}
.vbox-content{
text-align: center;
float: left;
width: 100%;
position: relative;
overflow: hidden;
padding: 20px 10px;
}
.vbox-container img{
max-width: 100%;
height: auto;
}
.figlio{
box-shadow: 0 0 12px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
max-width: 100%;
text-align: initial;
}
img.figlio{
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
}
.vbox-content.swipe-left{
margin-left: -200px !important;
}
.vbox-content.swipe-right{
margin-left: 200px !important;
}
.animated{
webkit-transition: margin 300ms ease-out;
transition: margin 300ms ease-out;
}
.animate-in{
opacity: 1;
}
.animate-out{
opacity: 0;
} .sk-double-bounce,.sk-rotating-plane{width:40px;height:40px;margin:40px auto}.sk-rotating-plane{background-color:#333;-webkit-backface-visibility:visible;-moz-backface-visibility:visible;backface-visibility:visible;-webkit-animation:sk-rotatePlane 1.2s infinite ease-in-out;animation:sk-rotatePlane 1.2s infinite ease-in-out}@-webkit-keyframes sk-rotatePlane{0%{-webkit-transform:perspective(120px) rotateX(0) rotateY(0);transform:perspective(120px) rotateX(0) rotateY(0)}50%{-webkit-transform:perspective(120px) rotateX(-180.1deg) rotateY(0);transform:perspective(120px) rotateX(-180.1deg) rotateY(0)}100%{-webkit-transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg);transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg)}}@keyframes sk-rotatePlane{0%{-webkit-transform:perspective(120px) rotateX(0) rotateY(0);transform:perspective(120px) rotateX(0) rotateY(0)}50%{-webkit-transform:perspective(120px) rotateX(-180.1deg) rotateY(0);transform:perspective(120px) rotateX(-180.1deg) rotateY(0)}100%{-webkit-transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg);transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg)}}.sk-double-bounce{position:relative}.sk-double-bounce .sk-child{width:100%;height:100%;border-radius:50%;background-color:#333;opacity:.6;position:absolute;top:0;left:0;-webkit-animation:sk-doubleBounce 2s infinite ease-in-out;animation:sk-doubleBounce 2s infinite ease-in-out}.sk-double-bounce .sk-double-bounce2{-webkit-animation-delay:-1s;animation-delay:-1s}@-webkit-keyframes sk-doubleBounce{0%,100%{-webkit-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes sk-doubleBounce{0%,100%{-webkit-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1);transform:scale(1)}}.sk-wave{width:50px;height:40px;text-align:center;font-size:10px;margin:40px auto}.sk-wave .sk-rect{background-color:#333;height:100%;width:4px;margin:0 1px;display:inline-block;-webkit-animation:sk-waveStretchDelay 1.2s infinite ease-in-out;animation:sk-waveStretchDelay 1.2s infinite ease-in-out}.sk-wave .sk-rect1{-webkit-animation-delay:-1.2s;animation-delay:-1.2s}.sk-wave .sk-rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.sk-wave .sk-rect3{-webkit-animation-delay:-1s;animation-delay:-1s}.sk-wave .sk-rect4{-webkit-animation-delay:-.9s;animation-delay:-.9s}.sk-wave .sk-rect5{-webkit-animation-delay:-.8s;animation-delay:-.8s}@-webkit-keyframes sk-waveStretchDelay{0%,100%,40%{-webkit-transform:scaleY(.4);transform:scaleY(.4)}20%{-webkit-transform:scaleY(1);transform:scaleY(1)}}@keyframes sk-waveStretchDelay{0%,100%,40%{-webkit-transform:scaleY(.4);transform:scaleY(.4)}20%{-webkit-transform:scaleY(1);transform:scaleY(1)}}.sk-three-bounce{margin:40px auto;width:100px;text-align:center}.sk-three-bounce .sk-child{width:16px;height:16px;background-color:#333;border-radius:100%;margin:4px;display:inline-block;-webkit-animation:sk-three-bounce 1.4s ease-in-out 0s infinite both;animation:sk-three-bounce 1.4s ease-in-out 0s infinite both}.sk-cube-grid,.sk-spinner-pulse{width:40px;height:40px;margin:40px auto}.sk-three-bounce .sk-bounce1{-webkit-animation-delay:-.32s;animation-delay:-.32s}.sk-three-bounce .sk-bounce2{-webkit-animation-delay:-.16s;animation-delay:-.16s}@-webkit-keyframes sk-three-bounce{0%,100%,80%{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes sk-three-bounce{0%,100%,80%{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}.sk-spinner-pulse{background-color:#333;border-radius:100%;-webkit-animation:sk-pulseScaleOut 1s infinite ease-in-out;animation:sk-pulseScaleOut 1s infinite ease-in-out}@-webkit-keyframes sk-pulseScaleOut{0%{-webkit-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);transform:scale(1);opacity:0}}@keyframes sk-pulseScaleOut{0%{-webkit-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);transform:scale(1);opacity:0}}.sk-cube-grid .sk-cube{width:33.33%;height:33.33%;background-color:#333;float:left;-webkit-animation:sk-cubeGridScaleDelay 1.3s infinite ease-in-out;animation:sk-cubeGridScaleDelay 1.3s infinite ease-in-out}.sk-cube-grid .sk-cube1{-webkit-animation-delay:.2s;animation-delay:.2s}.sk-cube-grid .sk-cube2{-webkit-animation-delay:.3s;animation-delay:.3s}.sk-cube-grid .sk-cube3{-webkit-animation-delay:.4s;animation-delay:.4s}.sk-cube-grid .sk-cube4{-webkit-animation-delay:.1s;animation-delay:.1s}.sk-cube-grid .sk-cube5{-webkit-animation-delay:.2s;animation-delay:.2s}.sk-cube-grid .sk-cube6{-webkit-animation-delay:.3s;animation-delay:.3s}.sk-cube-grid .sk-cube7{-webkit-animation-delay:0ms;animation-delay:0ms}.sk-cube-grid .sk-cube8{-webkit-animation-delay:.1s;animation-delay:.1s}.sk-cube-grid .sk-cube9{-webkit-animation-delay:.2s;animation-delay:.2s}@-webkit-keyframes sk-cubeGridScaleDelay{0%,100%,70%{-webkit-transform:scale3D(1,1,1);transform:scale3D(1,1,1)}35%{-webkit-transform:scale3D(0,0,1);transform:scale3D(0,0,1)}}@keyframes sk-cubeGridScaleDelay{0%,100%,70%{-webkit-transform:scale3D(1,1,1);transform:scale3D(1,1,1)}35%{-webkit-transform:scale3D(0,0,1);transform:scale3D(0,0,1)}}.sk-wandering-cubes{margin:40px auto;width:40px;height:40px;position:relative}.sk-wandering-cubes .sk-cube{background-color:#333;width:10px;height:10px;position:absolute;top:0;left:0;-webkit-animation:sk-wanderingCube 1.8s ease-in-out -1.8s infinite both;animation:sk-wanderingCube 1.8s ease-in-out -1.8s infinite both}.sk-wandering-cubes .sk-cube2{-webkit-animation-delay:-.9s;animation-delay:-.9s}@-webkit-keyframes sk-wanderingCube{0%{-webkit-transform:rotate(0);transform:rotate(0)}25%{-webkit-transform:translateX(30px) rotate(-90deg) scale(.5);transform:translateX(30px) rotate(-90deg) scale(.5)}50%{-webkit-transform:translateX(30px) translateY(30px) rotate(-179deg);transform:translateX(30px) translateY(30px) rotate(-179deg)}50.1%{-webkit-transform:translateX(30px) translateY(30px) rotate(-180deg);transform:translateX(30px) translateY(30px) rotate(-180deg)}75%{-webkit-transform:translateX(0) translateY(30px) rotate(-270deg) scale(.5);transform:translateX(0) translateY(30px) rotate(-270deg) scale(.5)}100%{-webkit-transform:rotate(-360deg);transform:rotate(-360deg)}}@keyframes sk-wanderingCube{0%{-webkit-transform:rotate(0);transform:rotate(0)}25%{-webkit-transform:translateX(30px) rotate(-90deg) scale(.5);transform:translateX(30px) rotate(-90deg) scale(.5)}50%{-webkit-transform:translateX(30px) translateY(30px) rotate(-179deg);transform:translateX(30px) translateY(30px) rotate(-179deg)}50.1%{-webkit-transform:translateX(30px) translateY(30px) rotate(-180deg);transform:translateX(30px) translateY(30px) rotate(-180deg)}75%{-webkit-transform:translateX(0) translateY(30px) rotate(-270deg) scale(.5);transform:translateX(0) translateY(30px) rotate(-270deg) scale(.5)}100%{-webkit-transform:rotate(-360deg);transform:rotate(-360deg)}}
  body {background-color:; color: #000;z-index: 0;}
.section {position: relative;z-index: 0;  }
.section:before,.section:after {content:"";display:table;}
.section:after {clear:both;}.section {zoom:1;}
.section > .inner {padding:50px 100px 0;}
.home h1.title {opacity: 0;font-family: 'Playfair Display', serif;font-weight:400;position: relative;text-align:left;margin-left: 150px;margin-top:100px;font-size: 21px;letter-spacing: 4px;transition:all .5s ease;-webkit-transition:all .5s ease;z-index: 9;}
.home h1.title::before {opacity: 0;content: ''; position: absolute; bottom: -25px;left: 2px;width: 14px;margin-left: -50px; height: 2px; background-color: #D0C5B0;transition:all .5s ease;-webkit-transition:all .5s ease;z-index: 9;}
.misc .section h1.title {font-family: 'Playfair Display', serif;font-weight:400;position: relative;text-align:center;font-size: 24px;letter-spacing: 4px;margin-top:50px;}
.misc .section h1.title::before { content: ''; position: absolute; bottom: -25px;left: 50%;width: 14px; margin-left: -7px;height: 2px; background-color: #D0C5B0;}
@media screen and (max-width: 768px) {
.home h1.title {margin-left: 50px;}
.section > .inner {padding:25px 25px 0;}
}
@media screen and (max-width: 767px) {
.home h1.title {margin-left: 0px; font-size: 18px;letter-spacing: 3px;margin-top: 50px;}
.home h1.title::before {bottom: -20px;}
.section > .inner {padding:0px 25px 0;}
} .home .active h1.title {opacity: 1;margin-left: 200px; -webkit-transition:all .5s .0s ease;transition:all .5s .0s ease;}
.home .active h1.title::before {opacity: 1;margin-left: 0px;-webkit-transition:all .5s .1s ease;transition:all .5s .1s ease;}
.imgEfct::before {position: absolute;top: 0;left: 0;display: block; width: 100%;height: 100%; background-color: #fff; content: ''; z-index: 99;transition:all .5s ease;-webkit-transition:all .5s ease;}
.imgEfct::after {position: absolute;top: 0;left: 0;display: block; width: 100%;height: 100%; background-color: #f3f0eb; content: ''; z-index: 88;transition:all .5s ease;-webkit-transition:all .5s ease;}
.active .imgEfct::before {left: -100%;-webkit-transition:all .5s .4s ease;transition:all .5s .4s ease;}
.active .imgEfct::after {left: -100%;-webkit-transition:all .5s .7s ease;transition:all .5s .7s ease;}
.imgEfct2::before {position: absolute;top: 0;left: 0;display: block; width: 100%;height: 100%; background-color: #f3f0eb; content: ''; z-index: 9;transition:all .5s ease;-webkit-transition:all .5s ease;}
.imgEfct2::after {position: absolute;top: 0;left: 0;display: block; width: 100%;height: 100%; background-color: #90897A; content: ''; z-index: 8;transition:all .5s ease;-webkit-transition:all .5s ease;}
.active .imgEfct2::before {left: -100%;-webkit-transition:all .5s .4s ease;transition:all .5s .4s ease;}
.active .imgEfct2::after {left: -100%;-webkit-transition:all .5s .7s ease;transition:all .5s .7s ease;}
@media screen and (max-width: 768px) {
.home .active h1.title {margin-left: 100px;}
}
@media screen and (max-width: 767px) {
.home .active h1.title {margin-left: 50px;}
} #progress {width: 100%;height: 100%;position: fixed; top: 0; left: 0;z-index: 9999999;display:block;overflow: hidden;}
#progress .logo {position: absolute; bottom:75px;left:0px;width:100%; height:auto;display: block;z-index: 999999999;}
#progress .logo img {width:100%; height:auto;display: block;z-index: 9999999!important; position: relative;}
#progress .progressInner {top:0;width: 100%;height:100%;display: block; position: fixed;background:#90897A;left: 0;}
#progress .progressBar {position: relative;left: 0px; bottom:0%;display: block;width:0%;height:100%;z-index: 99999999; overflow: hidden;}
#progress .progressBar::before {content: ''; position: absolute;left: 0;bottom: 0;height: 100%;width: 100%;background-color:#403D36;}
#progress.active {}
#progress.active .progressInner  {opacity: 0;-webkit-transition: all 0.7s ease;transition: all 0.7s ease;}
#progress.active .progressBar {opacity: 0;-webkit-transition: all 1s 0.7s ease;transition: all 1s 0.7s ease;}
#progress.active .logo {opacity: 0;-webkit-transition: all 1s 0.7s ease;transition: all 1s 0.7s ease;} .home #mainVisual {position: relative;width: 100%;height: 100%;display: block; z-index: 1;padding:0px 0 0 0;box-sizing: border-box;-webkit-box-sizing: border-box;background-image: url(//nathanielrosen.net/wp-content/themes/nathanielrosen/images/common/mv.jpg); background-repeat: no-repeat; background-position: top right; background-size: cover;}
.home #mainVisual > .inner {z-index: 2;overflow: hidden;position: relative; display: block;width: 100%;height: 100%;background-color: #666;}
.home #mainVisual .logo {position: absolute; bottom:75px;left:0px;width:100%; height:auto;display: block;z-index: 0;}
.home #mainVisual .logo img {width:100%; height:auto;display: block;z-index: 9999999!important; position: relative;}
.home #mainVisual .arrow {height: 150px; z-index:999;display: block;position: absolute; bottom:0px;right: 20px;width:100px;margin-left: -25px;overflow: hidden;}
.home #mainVisual .arrow p {color: #fff;font-size: 11px;letter-spacing: 4px;display: block; text-align: center; position: absolute;top:20px;right: 15px;line-height: 1em; z-index: 101;transform: rotate(90deg);}
.home #mainVisual .arrow a {width: 51px;display: block;padding-left: 25px;}
.home #mainVisual .arrow a > .inner {height: 150px;width: 1px; display: block;position: relative;background-color:transparent;}
.home #mainVisual .arrow a > .inner .scrl {height: 150px;background-color:#FFF;position: absolute; top:0px; left: 0px;width: 1px; z-index: 100;-webkit-animation: sdb 2s infinite;animation: sdb 2s infinite;}
.home #mainVisual .arrow a > .inner .scrl::before {content:''; height: 1px; width: 10px; transform: rotate(-45deg); position: absolute; bottom: 2px; left: -1px; background-color:#fff;}
@-webkit-keyframes sdb {0% {transform: translate(0, -150px);}90% {transform: translate(0, 150px);}100% {-webkit-transform: translate(0, 150px);}}
@keyframes sdb {0% {transform: translate(0, -150px);}90% {transform: translate(0, 150px);}100% {-webkit-transform: translate(0, 150px);}}
@media screen and (max-width: 768px) {
.home #mainVisual {height:944px;background-image: url(//nathanielrosen.net/wp-content/themes/nathanielrosen/images/common/mv.jpg); background-position: center top;margin-top: 80px;}
.home #mainVisual .logo {position: absolute; bottom:180px;left:0px;width:100%; height:auto;display: block;z-index: 0;}
}
@media screen and (max-width: 767px) {
.home #mainVisual {height:495px;background-image: url(//nathanielrosen.net/wp-content/themes/nathanielrosen/images/common/mv_sp.jpg); margin-top: 60px;}
.home #mainVisual .logo {position: absolute; bottom:20%;left:0px;width:100%; height:auto;display: block;z-index: 0;}
.home #mainVisual .arrow {display: none;}
}
@media screen and (max-width: 320px) {
.home #mainVisual {height:480px;background-image: url(//nathanielrosen.net/wp-content/themes/nathanielrosen/images/common/mv_sp.jpg); margin-top: 60px;}
.home #mainVisual .logo {position: absolute; bottom:20%;left:0px;width:100%; height:auto;display: block;z-index: 0;}
.home #mainVisual .arrow {display: none;}
} #profile {display: block;position: relative;z-index: 1;}
#profile .title {margin-bottom: 75px;}
#profile .inner {padding:0px; margin: 0;position:relative;display: flex;height: 100%;}
#profile .inner .imgArea { overflow: hidden;background-color: #000;width: 50%;display: flex;position: sticky;position: -webkit-sticky;justify-content: center;top: 80px;height:790px;background-image: url(//nathanielrosen.net/wp-content/themes/nathanielrosen/images/profile/main.jpg); background-size: cover; background-position: top center; background-repeat: no-repeat;}
#profile .inner .textArea {margin-top: 50px;opacity: 0;width: 50%;display: block;font-size: 14px;padding-left: 100px;padding-right: 100px;padding-top: 0px;transition:all 1s .5s ease;-webkit-transition:all 1s .5s ease;}
#profile .inner .textArea dl {margin-bottom: 50px;line-height: 1.4em;}
#profile .inner .textArea dl dt {float: left;}
#profile .inner .textArea dl dd {margin-bottom: 20px;padding-left: 25px;}
#profile .inner .textArea dl.none {margin-bottom: 0;}
#profile .inner .textArea dl.none dd:last-child {margin-bottom: 0px;}
#profile .inner .textArea .text {margin-bottom: 50px;line-height: 2.4em;}
#profile .inner .textArea .text.border {border-bottom: 1px solid #000;padding-bottom: 40px;}
#profile .inner .textArea .text p {font-size: 24px;letter-spacing: 5px;margin-bottom: 50px;margin-top: 25px;}
#profile .inner .textArea .text p span  {font-family: 'Playfair Display', serif;font-weight:400;margin-left: 20px;font-size: 12px;letter-spacing: 2px;}
#profile .inner .textArea h2 {font-size: 18px;line-height: 1em;margin-bottom: 50px;letter-spacing: 2px;}
#profile .inner .textArea h2 span {font-family: 'Playfair Display', serif;font-weight:400; font-size: 11px; margin-left:20px;}
#profile.active .inner .textArea {opacity: 1;margin-top: 0;}
@media screen and (max-width: 768px) {
#profile {padding: 0px 0px 0;}
#profile .inner {padding:0px; position:relative;display: block;height: auto;}
#profile .inner .imgArea {width: 100%;height:500px;display:block;position: relative;position:-webkit-relative;justify-content:inherit;top:inherit;background-position:center;background-image: url(//nathanielrosen.net/wp-content/themes/nathanielrosen/images/profile/main_sp.jpg); }
#profile .inner .textArea {width: 100%;display: block; font-size: 14px;padding: 80px 100px 0px;}
#profile .inner .textArea h2 {font-size: 16px;line-height: 1em;margin-bottom: 25px;}
#profile .inner .textArea .text p {font-size: 21px;letter-spacing: 3px;;margin-top: 0px;}
#profile .inner .textArea .text p span  {margin-left: 10px;font-size: 12px;letter-spacing: 1px;}
#profile .inner .textArea dl {margin-bottom: 25px;line-height: 1.4em;}
#profile .inner .textArea dl dd {margin-bottom: 10px;padding-left: 25px;}
}
@media screen and (max-width: 767px) {
#profile .inner .imgArea {height:400px;}
#profile .inner .textArea {display: block; font-size: 12px;padding: 50px 50px 0px 50px;}
#profile .inner .textArea .text {margin-bottom: 50px;line-height: 2.0em;}
#profile .inner .textArea .text p {font-size: 17px;letter-spacing: 5px;margin-bottom: 25px;margin-top: 0px;}
#profile .inner .textArea .text p span  {display:block; margin-left: 0px;font-size: 11px;}
} #video {padding: 0 0 200px;}
#video::after{content: ''; position: absolute;top: 0%; right: 0%;height: 150%;width:150%;transform: skewY(-15deg);background-color: rgba(208,197,176,0.25);display: block;z-index:-9;}
#video .inner {margin: 0 90px; opacity: 0;transition:all .5s ease;-webkit-transition:all .5s ease;margin-top: 75px;}
#video .tabs { display:block;font-size: 0;text-align:center;margin: 0px;padding: 0;width: 100%;height:auto;}
#video .tabs > li {width: 20%; float: left;margin:0px 0px 10px;padding:0px 5px;line-height: 0em;display:block; height:auto;cursor: pointer;transition:all .3s ease;-webkit-transition:all .3s ease;}
#video .tabs > li figure {margin: 0px;padding: 0;}
#video .tabs > li figure img {border:5px solid transparent;box-sizing: border-box;-webkit-box-sizing:border-box;margin: 0;padding: 0;transition:all .3s ease;-webkit-transition:all .3s ease;}
#video .tabs > li.active figure img,
#video .tabs > li:hover figure img { color:#fff;border:5px solid #D8B676; }
#video .tab_content {display: block;margin:0 10px 25px;}
#video .tab_content > .block {position: relative;display: none;margin: 0;padding:0;line-height: 0em; box-sizing: border-box; -webkit-box-sizing:border-box;}
#video .tab_content > .block a {cursor: pointer;}
#video .tab_content > .block figure {position: relative;z-index: 0;margin: 0;padding: 0;}
#video .tab_content > .block figure img {margin: 0;padding: 0;}
#video .tab_content > .block.active .play {display: block; width: 150px; height: 150px; position: absolute; top: 0; left: 0; right: 0; bottom: 0;margin: auto;}
#video .tab_content > .block.active h2 {text-align: right;display: block; width: 100%; height:auto; position: absolute; bottom: 0px; left: 0;line-height: 1.8em;padding: 15px 20px;color: #fff;font-family: 'Playfair Display', serif;font-weight:400!important;letter-spacing: 2px;font-size: 12px;display: block;box-sizing: border-box; -webkit-box-sizing: border-box;}
#video .tab_content > .block.active {display: block;}
#video.active .inner {opacity: 1;margin-top: 25px;transition:all .5s .5s ease;-webkit-transition:all .5s .5s ease;}
@media screen and (max-width: 768px) {
#video {padding:0 0 150px;}
#video::after{width:150%;height: 120%;transform: skewY(-15deg);top: 0%;}
#video .inner {margin: 0px 65px; opacity: 0;transition:all .5s ease;-webkit-transition:all .5s ease;margin-top: 0px;}
}
@media screen and (max-width: 767px) {
#video {padding:25px 0 150px;}
#video::after{width:150%;height: 100%;transform: skewY(-15deg);top: 0%;}
#video .inner {margin: 75px 10px 0px;padding: 0 10px; opacity: 0;transition:all .5s ease;-webkit-transition:all .5s ease;}
#video.active .inner {opacity: 1;margin-top: 50px;transition:all .5s .5s ease;-webkit-transition:all .5s .5s ease;}
#video .tab_content {display: block;margin:0 0px 5px;}
#video .tabs > li {width: 25%; float: left;margin:5px 0 0px;padding:0px 0px;}
#video .tabs > li.active figure img,
#video .tabs > li:hover figure img { color:#fff;border:3px solid #D8B676; }
#video .tab_content > .block.active .play {display: block; width: 75px; height: 75px;}
#video .tab_content > .block.active h2 {line-height: 1.8em;padding: 5px 10px;letter-spacing: 0px;font-size: 10px;}
} #interval {display:block; width: 100%;height: 550px;padding:0px 25px 0 25px;margin-top: -100px; }
#interval .inner {display:block;background-color: #000;display: block;position: relative;width: 100%; height: 100%; z-index: 2;background-image: url(//nathanielrosen.net/wp-content/themes/nathanielrosen/images/disco/main.jpg); background-repeat: no-repeat; background-position: top right; background-size: cover;background-image: url(//nathanielrosen.net/wp-content/themes/nathanielrosen/images/disco/main.jpg); }
@media screen and (max-width: 768px) {
#interval {display:block; width: 100%;height: 350px;padding:0px;margin-top: -100px; }
}
@media screen and (max-width: 767px) {
#interval {display:block; width: 100%;height: 150px;padding:0px;margin-top: -100px; }
} #disco {position: relative;width: 100%;display: block;}
#disco .inner {padding-bottom: 0px;margin: 0 -25px;padding-top: 50px;}
#disco .inner .row ul li .block {position: relative;overflow: hidden;line-height: 0;cursor: pointer;}
#disco .inner .row ul li .block a {color: #000;}
#disco .inner .row ul li .block figure {border:1px solid #eee;}
#disco .inner .row ul li .block h2 {height: 40px;line-height:1.6em; font-size: 13px;margin: 20px 0 0;display: block;text-align: center;}
@media screen and (max-width: 1280px) {
#disco .inner .row ul li .block .cover {padding: 25px;}
}
@media screen and (max-width: 768px) {
#disco .inner {padding: 0px;margin: 25px 100px 0;}
#disco .inner .row ul li .block {margin-top: 25px;}
#disco .inner .row ul li .block figure {width: 100%;}
#disco .inner .row ul li .block h2 {height: 40px;line-height:1.6em; font-size: 12px;margin: 20px 0 0;display: block;text-align: center;}
}
@media screen and (max-width: 767px) {
#disco .inner {padding: 0px;margin: 25px 25px 0;}
#disco .inner .row ul li .block {margin-top: 0px;}
#disco .inner .row ul li .block figure {width: 100%;}
#disco .inner .row ul li .block h2 {display: none;}
} #lesson {padding:0px;}
#lesson::after{content: ''; position: absolute; top:4%; left: 0;height:70%;width: 150%;transform: skewY(-15deg);background-color:rgba(208,197,176,0.25);display: block;z-index: -2;}
#lesson .title {margin-bottom: -25px;}
#lesson .inner {padding: 0px 0px 100px 500px; position: relative;}
#lesson .inner .mainImg {opacity: 0;margin-left: 100px;overflow: hidden;position: relative; width: 100%;height:600px; background-color: #000;background-image: url(//nathanielrosen.net/wp-content/themes/nathanielrosen/images/lesson/main.jpg); background-repeat: no-repeat; background-position: top right; background-size: cover;transition:all .75s .25s ease;-webkit-transition:all .75s .25s ease;}
#lesson .inner .desc {opacity: 0;margin-left: -100px;overflow: hidden;font-size: 15px; line-height: 1.8em;padding: 80px;display: block; width: 500px; height: 500px; position: absolute; bottom: 25px;left: 100px;background-color: #FFF;box-shadow: 0px 0px 50px rgba(0,0,0,0.1);-webkit-box-shadow: 0px 0px 50px rgba(0,0,0,0.1);transition:all .75s .25s ease;-webkit-transition:all .75s .25s ease;}
#lesson .inner .desc h1 {font-size: 21px;padding-top: 15px;margin-bottom: 25px;padding-bottom: 25px; text-align: left;}
#lesson .inner .desc figure {width: 35px;height: auto; position: absolute; top: 50px;right:95px; transform: rotate(15deg);}
#lesson.active .inner .mainImg {opacity: 1;margin-left:0px;}
#lesson.active .inner .desc {opacity: 1;margin-left:0px;}
@media screen and (max-width: 768px) {
#lesson .title {margin-bottom: 0px;}
#lesson .inner {padding: 75px 0px 0 100px; position: relative;}
#lesson .inner .mainImg {opacity: 0;margin-left: 100px;margin-bottom: 0;overflow: hidden;position: relative; width: 100%;height:400px;}
#lesson .inner .desc {overflow: hidden;font-size: 15px; line-height: 1.8em;margin-top: 0;padding: 60px 80px 60px;margin-left: -100px;margin-top: -50px;display: block;position: relative;width:100%; bottom:inherit; height: auto;left: inherit;}
#lesson .inner .desc figure {width: 30px;height: auto; position: absolute; top:30px;right:85px; transform: rotate(15deg);}
#lesson.active .inner .mainImg {opacity: 1;margin-left:0px;}
#lesson.active .inner .desc {opacity: 1;margin-left:-50px;}
}
@media screen and (max-width: 767px) {
#lesson .title {margin-bottom: 0px;}
#lesson .inner {padding: 75px 0px 0 50px; position: relative;}
#lesson .inner .mainImg {opacity: 0;margin-left: 100px;margin-bottom: 0;overflow: hidden;position: relative; width: 100%;height:400px;}
#lesson .inner .desc {overflow: hidden;font-size: 12px; line-height: 1.8em;margin-top: 0;padding: 40px;margin-left: -75px;margin-top: -50px;display: block;position: relative;width:100%; bottom:inherit; height: auto;left: inherit;}
#lesson .inner .desc h1 {font-size: 18px;margin-bottom: 0;}
#lesson .inner .desc figure {width: 20px;top:30px;right:45px;}
#lesson.active .inner .mainImg {margin-left:0px;}
#lesson.active .inner .desc {margin-left:-25px;}
}
@media screen and (max-width: 320px) {
#lesson .inner .desc {overflow: hidden;font-size: 12px;padding: 30px 30px 40px;}
#lesson .inner .desc figure {display: none;}
} #concert .inner {opacity: 0;position: relative;left: -50px;transition:all .5s .5s ease;-webkit-transition:all .5s .5s ease;}
#concert.active .inner {opacity: 1;left: 0px;}
#concert .inner .pastBtn {z-index: 999;position: relative;cursor: pointer;background-color: #DBD1BA;line-height: 75px;display: block; text-align: center;font-family: 'Playfair Display', serif;font-weight:400;color:#4F4B43; font-size: 24px;letter-spacing: 2px;transition:all .3s ease;-webkit-transition:all .3s ease;}
#concert .inner .pastBtn .plus {width: 20px; height: 20px;position: absolute; top: 28px; right:25px;transition:all .5s ease;-webkit-transition:all .5s ease;}
#concert .inner .pastBtn .plus span {height:1px; width: 100%; background-color: #4F4B43;display: block; position: absolute;}
#concert .inner .pastBtn .plus span:nth-of-type(1) {top: 10px;}
#concert .inner .pastBtn .plus span:nth-of-type(2) {top: 10px;transform: rotate(90deg);}
#concert .inner .pastBtn.open .plus {transform: rotate(45deg);}
#concert .inner .pastBtn.open .plus span {background-color: #FFF;}
#concert .inner .pastBtn:hover .plus span {background-color: #FFF;}
#concert .inner .pastBtn.open,
#concert .inner .pastBtn:hover {background-color:#90897A;color:#fff; }
#concert .inner .pastLive {display: none;background-color: rgba(219,209,186,0.25);border-top: none;padding: 50px 75px 0;height: 300px; overflow-y: scroll;}
#concert .inner .pastLive h3 {text-align: center;font-size: 30px;margin-bottom: 25px; letter-spacing: 2px;font-family: 'Playfair Display', serif;font-weight:400;font-style: italic;}
#concert .inner .pastLive ul {margin: 0;padding: 0;padding-bottom: 50px;line-height: 1.8em;}
#concert .inner .pastLive ul li:first-child { border-top:1px solid #ddd;}
#concert .inner .pastLive ul li {letter-spacing: 0px;  border-bottom:1px solid #ddd; display: block;padding: 10px 25px;padding-left: 180px; position: relative; line-height: 1.8em; color: #333;}
#concert .inner .pastLive ul li span.date { width:180px; position: absolute; top: 50%;margin-top: -12px; left: 25px;font-size: 14px;letter-spacing: 0.5px; }
#concert .inner .pastLive ul li span.place {display:block;margin-left: 0px;font-size: 11px;line-height: 1.8em;margin-top: 0px;}
#concert .inner .pastLive ul li h4 {display: inline-block;font-size: 14px;}
#concert .inner .currentLive ul {margin: 0;padding: 25px 0px 0px;line-height: 1.8em;}
#concert .inner .currentLive ul li {letter-spacing: 0px;  border-top:1px solid #eee; display: block;position: relative; line-height: 1.8em; color: #333;padding-bottom: 25px;}
#concert .inner .currentLive ul li span.date { width:18%;float: left;display:block;font-size: 14px;letter-spacing: 2px;padding-top: 25px;padding-left: 25px;}
#concert .inner .currentLive ul li span.place { width:40%;float: left;display:block;margin-left: 0px;font-size: 13px;line-height: 2em;padding: 25px 0;padding-left: 25px;}
#concert .inner .currentLive ul li h4 {width:42%;float: left;display:block;font-size: 16px;letter-spacing: 2px;padding-top: 25px;}
@media screen and (max-width: 768px) {
#concert .inner .pastLive {display: none;background-color: rgba(219,209,186,0.25);border-top: none;padding: 30px 30px 0;height: 300px; overflow-y: scroll;}
#concert .inner .pastLive h3 {text-align: center;font-size: 24px;}
#concert .inner .pastLive ul {margin: 0;padding: 0;padding-bottom: 30px;line-height: 1.8em;}
#concert .inner .pastLive ul li {padding-left: 160px;}
#concert .inner .pastLive ul li span.date { width:160px;}
#concert .inner .currentLive ul li span.date { width:25%;float: left;display:block;font-size: 14px;letter-spacing: 2px;padding-top: 25px;padding-left: 25px;}
#concert .inner .currentLive ul li span.place { width:40%;float: left;display:block;margin-left: 0px;font-size: 13px;line-height: 2em;padding: 25px 0;padding-left: 25px;}
#concert .inner .currentLive ul li h4 {width:35%;float: left;display:block;font-size: 16px;letter-spacing: 2px;padding-top: 25px;}
}
@media screen and (max-width: 767px) {
#concert .inner .pastBtn {margin-top: 15px;z-index: 999;position: relative;cursor: pointer;background-color: #DBD1BA;line-height: 50px;display: block; text-align: center;font-family: 'Playfair Display', serif;font-weight:400;color:#4F4B43; font-size: 18px;letter-spacing: 2px;transition:all .3s ease;-webkit-transition:all .3s ease;}
#concert .inner .pastBtn .plus {width: 15px; height: 15px;position: absolute; top: 15px; right:20px;transition:all .5s ease;-webkit-transition:all .5s ease;}
#concert .inner .pastLive {display: none;background-color: rgba(219,209,186,0.25);border-top: none;padding: 20px 20px 0;height: 300px; overflow-y: scroll;}
#concert .inner .pastLive h3 {text-align: center;font-size: 24px;margin-bottom: 20px; letter-spacing: 2px;font-family: 'Playfair Display', serif;font-weight:400;font-style: italic;}
#concert .inner .pastLive ul {margin: 0;padding: 0;padding-bottom: 20px;line-height: 1.8em;}
#concert .inner .pastLive ul li:first-child { border-top:1px solid #ddd;}
#concert .inner .pastLive ul li {letter-spacing: 0px;  border-bottom:1px solid #ddd; display: block;padding: 10px;padding-left:0px; position: relative; line-height: 1.8em; color: #333;}
#concert .inner .pastLive ul li span.date { width:100%; display: block;position: relative;; top: inherit;;margin-top: 0; left: inherit;font-size: 12px;letter-spacing: 1px;padding: 0px 10px 0;}
#concert .inner .pastLive ul li span.place {display:block;margin-left: 0px;font-size: 11px;line-height: 1.8em;margin-top: 0px;padding: 10px 10px 0px;}
#concert .inner .pastLive ul li h4 {display:block;font-size: 13px;padding: 10px 10px 0;line-height: 1.8em;}
#concert .inner .pastLive ul li h4 br {display: none;}
#concert .inner .currentLive ul {margin: 0 -25px;padding: 50px 0px 0px;line-height: 1.8em;}
#concert .inner .currentLive ul li {letter-spacing: 0px;  border-top:1px solid #eee; display: block;position: relative; line-height: 1.8em; color: #333;padding-bottom: 0px;}
#concert .inner .currentLive ul li span.date { width:100%;float:none;display:block;font-size: 13px;letter-spacing: 1px;padding: 10px 25px 0;}
#concert .inner .currentLive ul li span.place {  width:100%;float:none;display:block;margin-left: 0px;font-size: 11px;line-height: 1.8em;padding: 10px 25px 20px;}
#concert .inner .currentLive ul li h4 { width:100%;float:none;display:block;font-size: 14px;letter-spacing: 1px;padding: 10px 25px 0;}
} #news {}
#news .inner {display:block;opacity: 0;bottom: -100px;position: relative;padding-bottom: 100px;transition:all .5s ease;-webkit-transition:all .5s ease;}
#news.active .inner {opacity: 1;bottom:0px;}
#news .accordion {padding:0px;padding-top: 25px;border-bottom: 1px dotted #ddd; margin: 0 auto;}
#news .accordion > dt {border-top: 1px dotted #ddd;position: relative;background-color: #FFF; color:#000;line-height: 1.8em;padding: 25px;cursor:pointer;display: block;}
#news .accordion > dt > span{position:absolute;display: block;left: 25px; top: 23px;color: #000;font-size:14px;letter-spacing: 2px;font-family: 'Playfair Display', serif;font-weight:400;}
#news .accordion > dt > h2 {display: inline-block;font-size: 14px;margin-left: 120px;margin-right: 50px; text-align: left;}
#news .accordion > dt > h2 span {margin-left: 15px;letter-spacing: 2px;font-family: 'Playfair Display', serif;font-weight:400;color: #DBD1BA;}
#news .accordion > dt:hover{background-color: #fafafa;-webkit-transition: all .3s ease;transition: all .3s ease;}
#news .accordion > dt .plus {width: 20px; height: 20px;position: absolute; top: 24px; right:25px;transition:all .5s ease;-webkit-transition:all .5s ease;}
#news .accordion > dt .plus span {height:1px; width: 100%; background-color: #000;display: block; position: absolute;}
#news .accordion > dt .plus span:nth-of-type(1) {top: 10px;}
#news .accordion > dt .plus span:nth-of-type(2) {top: 10px;transform: rotate(90deg);}
#news .accordion > dt.open .plus {transform: rotate(45deg);}
#news .accordion > dt.open:hover {background-color: #fff;}
#news .accordion > dd { display: none;margin: 0; padding: 50px; background-color: #fafafa; line-height:1.8em;}
#news .accordion > dd figure {float: right;margin-left: 50px;width: 30%; height: auto;}
#news .accordion > dd .link {display: block;border:1px solid #000;margin-top: 20px;width: 250px;}
#news .accordion > dd .link a {display: block;text-align: center;line-height: 40px;background-color: #FFF;color: #000; text-align: center; position: relative;transition:all .5s ease;-webkit-transition:all .5s ease;}
#news .accordion > dd .link a .fa { position: absolute; top: 50%;margin-top: -10px; right: 15px;line-height: 1em;font-size: 18px;}
#news .accordion > dd .link a:hover {background-color: #000; color: #fff;}
@media screen and (max-width: 768px) {
#news .inner {padding-top:50px;padding-bottom: 50px;}
#news .accordion {width:auto; margin: 0 25px;}
#news .accordion > dd {padding: 25px;}
#news .accordion > dd figure {margin-left: 25px;width: 40%;}
}
@media screen and (max-width: 767px) {
#news {padding: 0px 0px;}
#news .inner {padding-top:25px;padding-bottom: 50px;}
#news .accordion {width:auto; margin: 0 -25px;}
#news .accordion > dt {line-height: 1.6em;padding:20px 25px ;}
#news .accordion > dt > span{ position: relative; left: inherit; top: inherit;margin: 0;padding: 0;font-size:14px;letter-spacing: 2px;font-family: 'Playfair Display', serif;font-weight:400;line-height: 1em;}
#news .accordion > dt > h2 {display:block;font-size: 13px;margin: 0;padding: 0;margin-top: 15px;}
#news .accordion > dt:hover{background-color: #fafafa;-webkit-transition: all .3s ease;transition: all .3s ease;}
#news .accordion > dt .plus {width: 14px; height: 14px;top: 20px; right:20px;}
#news .accordion > dt .plus span:nth-of-type(1) {top: 7px;}
#news .accordion > dt .plus span:nth-of-type(2) {top: 7px;}
#news .accordion > dd { display: none;margin: 0; padding: 25px; background-color: #fafafa; line-height:1.8em;font-size: 13px;}
#news .accordion > dd figure {margin-left: 0;width: 100%;height: auto;float: none;margin-bottom: 20px;}
#news .accordion > dd .link {display: block;border:1px solid #000;margin-top: 20px; width: 100%;}
#news .accordion > dd .link a {display: block;text-align: center;line-height: 40px;background-color: #FFF;color: #000; text-align: center; position: relative;transition:all .5s ease;-webkit-transition:all .5s ease;}
#news .accordion > dd .link a .fa { position: absolute; top: 50%;margin-top: -10px; right: 15px;line-height: 1em;font-size: 18px;}
#news .accordion > dd .link a:hover {background-color: #000; color: #fff;}
} #contact {opacity: 0;margin-left: -100px;margin-right: -100px; position: relative;padding: 400px 0 50px;background-color:#D0C5B0;transition:all 1s ease;-webkit-transition:all 1s ease;}
#contact.active {opacity: 1;margin-left: 0;margin-right: 0;}
#contact::before {content:'';width: 100%;height:520px; position: absolute; top: 0;left: 0;background-image: url(//nathanielrosen.net/wp-content/themes/nathanielrosen/images/contact/main.jpg); background-repeat: no-repeat; background-position: top center; background-size:cover;}
#contact  h1.title {font-family: 'Playfair Display', serif;font-weight:400;position:absolute;top: 0;left: 0;text-align:left;margin-left: 200px;margin-top:100px;font-size: 21px;letter-spacing: 4px;z-index: 0;}
#contact  h1.title::before { content: ''; position: absolute; bottom: -25px;left: 2px;width: 14px; margin-left: 0px;height: 2px; background-color: #D0C5B0;}
#contact .tab { display: block;font-size: 0;padding: 0 75px;}
#contact .tab li {position: relative;width: 50%;margin: 0;padding: 0 25px; display:block; float: left;color: #000; }
#contact .tab li .inner {-webkit-transition: all .5s ease;transition: all .5s ease;position: relative;display: block;margin: 0 auto;text-align:center;}
#contact .tab li .inner a {margin: 0;padding: 0;color: #000;height: 80px;width: 100%;display: block; position: relative;background-color:rgba(255,255,255,0.9);transition:all .5s ease;}
#contact .tab li .inner a h2 {padding-top: 20px;text-align: center;font-family: 'Playfair Display', serif;font-weight:400;font-size:18px;letter-spacing: 1px;line-height: 1em; }
#contact .tab li .inner a p {margin-top: 15px; font-size: 12px;}
#contact .tab li .inner a .fa {position: absolute; top: 50%; right: 30px;font-size: 18px; line-height: 1em;margin-top: -8px;}
#contact .tab li .inner a:hover {background-color: #504C44;color: #fff;}
#contact .tab li .inner .form-open {height: 80px;width: 100%;display: block;background-color:rgba(255,255,255,0.9);color:#000;text-align:center;cursor:pointer;position:relative;box-sizing:border-box;transition:all .5s ease;}
#contact .tab li .inner .form-open h3 { height: 80px;line-height: 80px;width: 100%;display: block;text-align: center;font-family: 'Playfair Display', serif;font-weight:400;font-size:21px;letter-spacing: 1px;}
#contact .tab li .inner .form-open .fa {position: absolute; top: 50%; right: 30px;font-size: 24px; line-height: 1em;margin-top: -12px;}
#contact .tab li .inner .form-open .fa-angle-down {opacity: 1;}
#contact .tab li .inner .form-open .fa-angle-up {opacity: 0;}
#contact .tab li .inner .form-open.active {background-color:#504C44;color: #fff;}
#contact .tab li .inner .form-open.active .fa-angle-down {opacity: 0;}
#contact .tab li .inner .form-open.active .fa-angle-up {opacity: 1;}
#contact .tab li .inner .form-open:hover {background-color: #504C44;color: #fff;}
#contact #formBox {margin: 0 100px;padding: 120px 0 100px;display: none;background-color:#504C44; position: relative;}
#contact #formBox .form-close {width: 70px; height: 70px;display: block; position: absolute; top: 50px; right:50px;cursor: pointer;}
#contact #formBox .form-close span {position: absolute;top: 35px;left: 0;width: 100%;height: 1px;background-color: #FFF;border-radius: 4px;opacity: 1;}
#contact #formBox .form-close span:nth-of-type(1) {-webkit-transform: rotate(-45deg);transform: rotate(-45deg);}
#contact #formBox .form-close span:nth-of-type(2) {-webkit-transform: rotate(45deg);transform: rotate(45deg);}
#contact #formBox .formWrap { width: 800px; margin: 0 auto; }
@media screen and (max-width: 768px) {
#contact {opacity: 0;margin-left: -100px;margin-right: -100px; position: relative;padding: 400px 0 50px;}
#contact::before {height:600px;}
#contact .tab li {position: relative;width: 100%;margin: 0;margin-top: 5px;padding: 0px; display:block; float:none;}
#contact #formBox {margin: -1px 25px 0;padding: 100px 0 50px;display: none;background-color:#504C44; position: relative;}
#contact #formBox .form-close {width: 50px; height: 50px;display: block; position: absolute; top: 15px; right:25px;cursor: pointer;}
#contact #formBox .formWrap { width:auto; margin: 0 25px; }
#contact  h1.title {margin-left: 95px;margin-top:100px;font-size: 21px;letter-spacing: 4px;z-index: 0;}
}
@media screen and (max-width: 767px) {
#contact {opacity: 0;margin-left: -100px;margin-right: -100px; position: relative;padding: 365px 0 15px;}
#contact::before {height:350px;}
#contact .tab { display: block;font-size: 0;padding: 0px 15px;}
#contact .tab li {position: relative;width: 100%;margin: 0;margin-top: 5px;padding: 0px; display:block; float:none;}
#contact .tab li .inner a h2 {padding-top: 20px;text-align: center;font-family: 'Playfair Display', serif;font-weight:400;font-size:14px;letter-spacing: 1px;line-height: 1em; }
#contact .tab li .inner a p {margin-top: 15px; font-size: 11px;}
#contact .tab li .inner a .fa {position: absolute; top: 50%; right: 20px;font-size: 18px; line-height: 1em;margin-top: -8px;}
#contact #formBox {margin: -1px 15px 0;padding: 75px 0 25px;display: none;background-color:#504C44; position: relative;}
#contact .tab li .inner .form-open h3 {font-size: 16px;}
#contact  h1.title {margin-left: 50px;margin-top:50px;font-size: 21px;letter-spacing: 4px;z-index: 0;}
} #footer {height: 400px; width: 100%; display: block; position: relative;background-color: #fff;z-index: 1;font-family: 'Playfair Display', serif;font-weight:400;}
#footer .logo {width: 210px;position: absolute; top:150px; left: 100px;}
#footer .copyright { position: absolute; bottom: 100px; left: 100px;text-align: right;font-weight: 400;font-size: 10px; letter-spacing: 2px;color:#000;}
#footer .footNav { position: absolute; left: 350px; top:140px;}
#footer .footNav ul { height: 50px; text-align: right;font-size: 0;display: inline-block;}
#footer .footNav ul li {display:inline-block;position: relative;z-index: 0;overflow: hidden;height: 50px;margin-right: 20px; }
#footer .footNav ul li a {letter-spacing: 2px;font-size: 12px;color: #000;z-index: 2;position: relative;text-align: center;display: block;padding:0px;line-height: 50px;transition:all .3s ease;-webkit-transition:all .3s ease;}
#footer .footNav ul li a:hover,
#footer .footNav ul li a:focus,
#footer .footNav ul li a:active { text-decoration: none;color:#D0C5B0;}
#footer .subNav { position: absolute; right: 100px; bottom:80px;}
#footer .subNav ul { height: 50px; text-align:right;font-size: 0;display: inline-block;}
#footer .subNav ul li {display:inline-block;position: relative;z-index: 0;overflow: hidden;height: 50px;}
#footer .subNav ul li a {color: #333;font-size: 10px;position: relative;display: block;margin-left: 20px;line-height: 50px;letter-spacing: 2px;}
#footer .subNav ul li a:hover {text-decoration: underline;}
#footer .snsNav { position: absolute; right:75px; top:140px;}
#footer .snsNav ul { height: 50px; text-align:left;font-size: 0;display: inline-block;}
#footer .snsNav ul li {display:inline-block;position: relative;z-index: 0;overflow: hidden;height: 50px;}
#footer .snsNav ul li a {color: #ccc;font-size: 18px;position: relative;display: block;margin-right: 25px;line-height: 50px;letter-spacing: 2px;transition:all .3s ease;-webkit-transition:all .3s ease;}
#footer .snsNav ul li a:hover {text-decoration: underline;color:#D0C5B0;}
@media screen and (max-width: 768px) {
#footer {padding:75px 0 50px;height:auto; }
#footer .logo {width: 210px;position: relative; top:inherit; left: inherit;margin: 0 auto 25px;}
#footer .footNav,
#footer .subNav {display: none;}
#footer .snsNav { position: relative; right:inherit; top:inherit;width: 100%;margin-bottom: 25px;}
#footer .snsNav ul { text-align: center;display: block;}
#footer .snsNav ul li a {margin:0 10px;}
#footer .copyright span {display: none;}
#footer .copyright { position:relative;; bottom: inherit; left: inherit;text-align: center;font-weight: 400;font-size: 10px; letter-spacing: 2px;color:#000;}
} .modal-overlay {z-index:99999;display:block;position:fixed;top:0;left:0;width:100%;height:120%;background-color:#FFF; overflow: hidden;}
.disc {position: fixed;top: 0; left: 0;width: 100%; height: 100%;padding:100px; display:none; background-color: #FFF;z-index: 999999; overflow: auto;}
.disc .modal-close {position:fixed;top: 50px; right: 50px;width: 50px;height: 50px;cursor: pointer;overflow: hidden;display: block;z-index: 999999;}
.disc .modal-close span {display:block;box-sizing: border-box;width: 100%;height: 1px;background-color: #000; position: absolute; left: 0;transition:all .3s ease;-webkit-transition:all .3s ease;}
.disc .modal-close span:nth-of-type(1) {top: 0;-webkit-transform: translateY(25px) rotate(-45deg);transform: translateY(25px) rotate(-45deg);}
.disc .modal-close span:nth-of-type(2) {bottom:0;-webkit-transform: translateY(-25px) rotate(45deg);transform: translateY(-25px) rotate(45deg);}
.disc .modal-close:hover span {opacity: 0.5;}
.disc .inner {margin: 0;padding: 0;position:relative;padding-left: 35%;}
.disc .inner .imgArea {width: 35%;display:block;position:fixed;top:0px;left:0; height:auto;padding: 100px;padding-right: 0;padding-bottom: 0;}
.disc .inner .imgArea figure {border:1px solid #eee;}
.disc .inner .textArea {display: block;font-size: 13px;padding-left: 50px;padding-right: 0px;padding-top: 0px;line-height: 2em;color: #000; letter-spacing: 2px;}
.disc .inner .textArea h1 {font-size: 21px;padding-bottom: 25px;line-height: 1.4em;}
.disc .inner .textArea h1 span {display: block;margin-top: 20px;}
.disc .inner .textArea dl {margin-bottom: 50px;line-height: 1.4em;}
.disc .inner .textArea dl dt {float: left;}
.disc .inner .textArea dl dd {margin-bottom: 25px;padding-left: 25px;}
.disc .inner .textArea dl.none {margin-bottom: 0;}
.disc .inner .textArea dl.none dd:last-child {margin-bottom: 0px;}
.disc .inner .textArea ul {margin-bottom: 50px;}
.disc .inner .textArea ul li {line-height:1.4em;margin-bottom: 15px;letter-spacing: 0;}
.disc .inner .textArea .text {margin-bottom: 50px;line-height: 2.2em;}
.disc .inner .textArea .text.border {border-bottom: 1px solid #000;padding-bottom: 40px;}
.disc .inner .textArea .text p {font-size: 13px;margin-bottom: 15px;}
.disc .inner .textArea h2 {font-size: 16px;line-height: 1em;margin-bottom: 25px;letter-spacing: 2px;}
.disc .inner .textArea h2 span {font-family: 'Playfair Display', serif;font-weight:400; font-size: 11px; margin-left:20px;}
.disc .inner .textArea h3 {margin-bottom: 25px;border-bottom: 1px solid #ddd;padding-bottom: 5px;letter-spacing: 0;}
.disc .inner .textArea .btn.more {margin: 0;max-width: 300px;}
@media screen and (max-width: 1200px) {
.disc {padding:75px 50px 100px;}
.disc .inner .imgArea {width: 40%;display:block;position:fixed;top:0px;left:0; height:auto;padding:75px 50px;padding-right: 0;padding-bottom: 0;}
.disc .inner .textArea {display: block;font-size: 13px;padding-left: 50px;padding-right: 0px;padding-top: 0px;line-height: 2em;color: #000; letter-spacing: 2px;}
}
@media screen and (max-width: 768px) {
.disc {padding:75px 50px 100px;}
.disc .inner {display:block;}
.disc .inner .imgArea {width: 40%;display:block;position:fixed;top:0px;left:0; height:auto;padding:75px 50px;padding-right: 0;padding-bottom: 0;}
.disc .inner .textArea {display: block;font-size: 13px;padding-left: 50px;padding-right: 0px;padding-top: 0px;line-height: 2em;color: #000; letter-spacing: 2px;}
.disc .modal-close {position:fixed;top: 25px; right: 25px;width: 30px;height: 30px;}
.disc .modal-close span:nth-of-type(1) {top: 0;-webkit-transform: translateY(15px) rotate(-45deg);transform: translateY(15px) rotate(-45deg);}
.disc .modal-close span:nth-of-type(2) {bottom:0;-webkit-transform: translateY(-15px) rotate(45deg);transform: translateY(-15px) rotate(45deg);}
}
@media screen and (max-width: 767px) {
.disc {padding:80px 25px 50px;}
.disc .inner {margin: 0;padding: 0;position:relative;width: 100%;display:block; background-color: #fff;}
.disc .inner .imgArea {width: 100%;display:block;position:relative;top:inherit;left:inherit; height:auto;padding:0;margin: 0;margin-bottom: 25px;}
.disc .inner .textArea {display: block;font-size: 12px;padding: 0px 25px;margin: 0;line-height: 2em;color: #000; letter-spacing: 1px;}
.disc .inner .textArea h1 {font-size: 21px;padding-bottom: 20px;}
.disc .inner .textArea .text p {font-size: 12px;margin-bottom: 15px;}
.disc .modal-close {position:fixed;top:15px; right: 15px;width: 30px;height: 30px;}
.disc .modal-close span:nth-of-type(1) {top: 0;-webkit-transform: translateY(15px) rotate(-45deg);transform: translateY(15px) rotate(-45deg);}
.disc .modal-close span:nth-of-type(2) {bottom:0;-webkit-transform: translateY(-15px) rotate(45deg);transform: translateY(-15px) rotate(45deg);}
}  @media screen and (min-width: 1680px) {
.section > .inner {padding:50px 250px 0;}
.home h1.title {opacity: 0;font-family: 'Playfair Display', serif;font-weight:400;position: relative;text-align:left;margin-left: 350px;margin-top:100px;font-size: 21px;letter-spacing: 4px;transition:all .5s ease;-webkit-transition:all .5s ease;z-index: 9;}
.home h1.title::before {opacity: 0;content: ''; position: absolute; bottom: -25px;left: 2px;width: 14px;margin-left: -50px; height: 2px; background-color: #D0C5B0;transition:all .5s ease;-webkit-transition:all .5s ease;z-index: 9;}
.home .active h1.title {opacity: 1;margin-left: 400px; -webkit-transition:all .5s .0s ease;transition:all .5s .0s ease;}
.home .active h1.title::before {opacity: 1;margin-left: 0px;-webkit-transition:all .5s .1s ease;transition:all .5s .1s ease;}
#interval {padding:0px 300px;}
#profile .inner {padding:0px 250px;}
#profile .inner .textArea {width: 50%;display: block;font-size: 14px;padding-left: 75px;padding-right: 0px;padding-top: 0px;}
#video .inner {margin: 0 -10px;}
#interval {padding:0px 250px;}
#lesson .inner .desc {opacity: 0;margin-left:0px;}
#lesson.active .inner .desc {opacity: 1;margin-left:100px;}
#lesson .inner {padding: 0px 200px 100px 600px; position: relative;}
#contact .tab { display: block;font-size: 0;padding: 0 275px;}
} @media screen and (min-width: 769px) {
body,html {width: 100%; height: 100%;min-height: 640px;min-width: 1140px;}
.sp_dspl { display:none!important;}
.pc_dspl { display:block!important;}
#spNav,#footBtn,.hamburger {display: none;}
.home #header { min-width: 1100px;height: 150px; width: 100%; display: block;position: absolute; top: 0; left: 0;z-index: 1;z-index: 9;font-family: 'Playfair Display', serif;font-weight:400;}
.home #header .inner { overflow: hidden;display: block; position:relative;height: 150px;}
.home #header .inner .logo {position: absolute; bottom:-10px;left:50px;width:600px; height:auto;display: none;}
.home #header .inner .logo a {width:100%; height:auto;display: block;}
.home #header .inner .logo img {width:100%; height:auto;display: block;}
.home #header .inner h1 {position: absolute; top:70px;left: 60px;display: block;line-height: 1em;font-size: 16px;letter-spacing: 4px;color:#FFF;}
.home #header .inner > .gnav {height:100px;position: absolute; right:100px; top: 0px;display:block;}
.home #header .inner > .gnav ul { height: 100px; text-align: right;font-size: 0;display: inline-block;}
.home #header .inner > .gnav ul li {display:inline-block;position: relative;z-index: 0;overflow: hidden;height: 100px; }
.home #header .inner > .gnav ul li a {color: #FFF;letter-spacing: 2px;font-size: 13px;z-index: 2;position: relative;height: 100px;text-align: center;display: block;padding:69px 15px 0;line-height: 1em;box-sizing: border-box;-webkit-box-sizing: border-box;transition:all .3s ease;-webkit-transition:all .3s ease;}
.home #header .inner > .gnav ul li a:hover,
.home #header .inner > .gnav ul li a:focus,
.home #header .inner > .gnav ul li a:active { text-decoration: none;}
.home #header .inner > .gnav ul li::before {content: '';z-index: 1;width: 100%; height: 100%; background-color:rgba(208,197,176,0.75);display: block; position: absolute; left:0; top: -100%;transition:all .3s ease;-webkit-transition:all .3s ease;}
.home #header .inner > .gnav ul li a:hover {}
.home #header .inner > .gnav ul li:hover::before { top: 0;}
.home #header .inner > .gnav ul li.current::before { top: 0;}
.home #header .inner > .lang {overflow: hidden;position: relative;border-left: 1px solid #fff;width: 60px; height:30px; line-height: 30px;text-align: center; display: block; position: absolute; top: 50%;margin-top: -14px; right: 25px;}
.home #header .inner > .lang::before {content: ''; position: absolute; top: 0; left: -100%; width: 100%;height: 100%;z-index: -1;background-color:rgba(208,197,176,0.75);transition:all .3s ease;-webkit-transition:all .3s ease;}
.home #header .inner > .lang a {color:#fff;font-size: 13px;width: 60px; height:30px;display: block;letter-spacing: 2px;transition:all .3s ease;-webkit-transition:all .3s ease;}
.home #header .inner > .lang a:hover { color: #000;}
.home #header .inner > .lang:hover {border-left: 1px solid rgba(208,197,176,0.75);}
.home #header .inner > .lang:hover::before {left: 0;} .home #header.fixed {}
.home #header.fixed .inner {background-color: #FFF;display: block; position:fixed;height: 80px;width: 100%;top: -90px; left: 0;z-index: 99; transform: translateY(80px);-webkit-transition: all .5s ease;transition: all .5s ease;}
.home #header.fixed .inner .logo {top:32px;width:240px;-webkit-transition:none;transition:none;display: block;}
.home #header.fixed .inner .logo a {width:240px;}
.home #header.fixed .inner h1 {display: none;}
.home #header.fixed .inner > .gnav {height:80px;}
.home #header.fixed .inner > .gnav ul {height: 80px;}
.home #header.fixed .inner > .gnav ul li {height: 80px;}
.home #header.fixed .inner > .gnav ul li a {height: 80px;padding-top:37px;color: #000;}
.home #header.fixed .inner > .gnav ul li a span {padding-top: 40px;}
.home #header.fixed .inner > .gnav ul li .effect {height: 80px;top:-80px;}
.home #header.fixed .inner > .gnav ul li:hover .effect { top: 0;}
.home #header.fixed .inner > .lang {border-left: 1px solid #000;height:30px;line-height: 30px;margin-top: -10px;}
.home #header.fixed .inner > .lang a {color:#000;height:30px;transition:all .3s ease;-webkit-transition:all .3s ease;}
.home #header.fixed .inner > .lang:hover {color: #000;}
.home #header.fixed .inner > .lang:hover {border-left: 1px solid #D0C5B0;}
.misc #header {box-shadow:none;-webkit-box-shadow:none;}
.misc #header .inner {display: block; position:fixed;height: 80px;width: 100%;top:0px; left: 0;z-index: 99999;box-shadow:none;-webkit-box-shadow:none;}
.misc #header .inner .logo {top:22px;width:240px; position: absolute;left: 50px;}
.misc #header .inner .logo a {width:100%; height:auto;display: block;}
.misc #header .inner .logo img {width:100%; height:auto;display: block;}
} @media screen and (max-width: 768px) {
body,html {-webkit-overflow-scrolling: touch;overflow-x: hidden;display: block;position: relative;width: 100%; height: auto;min-width: auto;}
html {-webkit-text-size-adjust: 100%;}
a:hover { text-decoration: none;}
.sp_dspl { display:block!important;}
.pc_dspl { display:none!important;}
.hover {-webkit-tap-highlight-color: transparent;}
#header {font-family: 'Playfair Display', serif;font-weight:400;width: 100%;min-width: auto;height: 80px;background-color: #FFF; position: fixed; top: 0; left: 0; z-index: 999;box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-webkit-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-moz-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-o-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-ms-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);}
#header .inner { display: block; position:relative;height: 80px;width: 100%;}
#header .inner .logo { position: absolute; top: 26px;left: 30px;width:270px;height:auto; display: block;}
#header .inner .logo a {width:100%; height:auto; display: block; background-color:transparent;transition:none;-webkit-transition:none;}
#header .inner .logo img {display: block; width:100%; height:auto;}
#header .inner h1,
#header .inner .gnav {display: none;}
#header .inner .tel { position: absolute; top:14px;left: 15px; height: 28px; width: 28px;}
#header .inner > .lang {position: absolute; top: 20px; right: 90px;display:block;width: 40px;height:40px;line-height: 40px;background-color: #000;font-family: 'Playfair Display', serif;font-weight:400;overflow: hidden;border-radius: 20px;-webkit-border-radius: 20px;}
#header .inner > .lang a { letter-spacing: -0.5px;display:block;font-size: 12px;text-align: center;color:#fff;width: 40px;height:40px;transition:all .3s ease;-webkit-transition:all .3s ease;}
#header .inner > .lang a:hover {color: #000;background-color: #D0C5B0;}
#hamburger {position:fixed;top: 25px; right: 30px;width: 30px;height: 29px;cursor: pointer;overflow: hidden;display: block;z-index: 9999;}
#hamburger span {display:block;box-sizing: border-box;transition:all 0.5s ease;-webkit-transition:all 0.5s ease;width: 100%;height: 1px;background-color: #000; position: absolute; left: 0;}
#hamburger span:nth-of-type(1) {top: 3px;}
#hamburger span:nth-of-type(2) {top: 14px;}
#hamburger span:nth-of-type(3) {bottom: 3px;}
#hamburger.active {z-index: 99999;}
#hamburger.active span:nth-of-type(1) {background-color: #000; top: 0;-webkit-transform: translateY(14px) rotate(-45deg);transform: translateY(14px) rotate(-45deg);}
#hamburger.active span:nth-of-type(2) {background-color: #000;bottom:0;-webkit-transform: translateY(0) rotate(45deg);transform: translateY(0) rotate(45deg);}
#hamburger.active span:nth-of-type(3) {-webkit-transform: translateX(-100%);transform: translateX(-100%);}
#spNav {padding: 0px 0px 30px;display:none; background-color:#D0C5B0; z-index: 9999; position: fixed; top: 0; left: 0; width: 100%; height: 100%; overflow-y: auto;}
#spNav ul.nav {font-size:0; text-align: center; height:auto; text-align: left;padding: 50px 0px 25px;}
#spNav ul.nav li {margin-bottom:30px;display: block;font-size:24px; width: 100%;color: #313131;text-align: left;}
#spNav ul.nav li a {font-size: 36px;padding: 10px 30px;display: block;color: #313131;transition:all 0.5s ease;-webkit-transition:all 0.5s ease;font-family: 'Playfair Display', serif;font-weight:400;}
#spNav ul.nav li a:hover {color:#fff;;}
#spNav h1 {width: 270px; height: auto;margin:26px 30px 0px;border-top: none;}
#spNav .btn {display: block; width: 20px; height: 20px; position: absolute; top: 18px; right:20px;}
#spNav .btn a {display: block;width: 20px; position: relative;}
#spNav .btn a img {width: 20px;}
#spNav ul.sns  { height: 80px; text-align: center;}
#spNav ul.sns li {display: inline-block;}
#spNav ul.sns li a {font-size:24px;height: 50px;color: #000;text-align: center;display: block;padding: 30px 10px 0;line-height: 1em;transition:all .5s ease;-webkit-transition:all .5s ease;}
#spNav ul.sns li a:hover {color: #999;}
#footBtn { position: fixed; bottom:0; left: 0;width: 100%;z-index: 9999;min-width: auto;}
#footBtn ul { margin-left: -1px;}
#footBtn ul li {width:20%;height: auto;float: left;border-left: 1px solid #003954;}
#footBtn ul li a {height: 60px;letter-spacing: 0px;padding: 15px 0px 0;font-weight: 400;text-align: center;background-color:#004868;display: block;font-size: 10px; color: #FFF;}
#footBtn ul li a span {display:block;text-align: center;font-size: 10px; margin-bottom: 7px;letter-spacing: -0.5px;}
#footBtn ul li a img {display: block; width: 25px; height: auto;margin:0px auto 5px;}
#footBtn ul li a.hover { background-color:#003954; text-decoration: none;}
.misc #header {box-shadow:none;-webkit-box-shadow:none;background-color: transparent;}
.misc #header .inner {background-color: transparent;display: block; position:fixed;height: 80px;width: 100%;top:0px; left: 0;z-index: 99999;box-shadow:none;-webkit-box-shadow:none;}
} @media screen and (max-width: 767px) {
body,html {-webkit-overflow-scrolling: touch;overflow-x: hidden;display: block;position: relative;width: 100%; height: auto;min-width: auto;}
html {-webkit-text-size-adjust: 100%;}
a:hover { text-decoration: none;}
.sp_dspl { display:block!important;}
.pc_dspl { display:none!important;}
.hover {-webkit-tap-highlight-color: transparent;}
#header {font-family: 'Playfair Display', serif;font-weight:400;width: 100%;min-width: auto;height: 60px;background-color: #FFF; position: fixed; top: 0; left: 0; z-index: 999;box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-webkit-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-moz-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-o-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-ms-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);}
#header .inner { display: block; position:relative;height: 60px;width: 100%;}
#header .inner .logo { position: absolute; top: 18px;left: 25px;width:210px;height:auto; display: block;}
#header .inner .logo a {width:100%; height:auto; display: block; background-color:transparent;transition:none;-webkit-transition:none;}
#header .inner .logo img {display: block; width:100%; height:auto;}
@media screen and (max-width: 320px) {
#header .inner .logo { position: absolute; top: 21px;left: 20px;width:180px;height:auto; display: block;}
}
#header .inner h1,
#header .inner .gnav {display: none;}
#header .inner .tel { position: absolute; top:14px;left: 15px; height: 28px; width: 28px;}
#header .inner > .lang {position: absolute; top: 15px; right: 60px;display:block;width: 30px;height:30px;line-height: 30px;background-color: #000;font-family: 'Playfair Display', serif;font-weight:400;overflow: hidden;border-radius: 15px;-webkit-border-radius: 15px;}
#header .inner > .lang a { letter-spacing: -0.5px;display:block;font-size: 10px;text-align: center;color:#fff;width: 30px;height:30px;transition:all .3s ease;-webkit-transition:all .3s ease;}
#header .inner > .lang a:hover {color: #000;background-color: #D0C5B0;}
#hamburger {position:fixed;top: 20px; right: 20px;width: 20px;height: 21px;cursor: pointer;overflow: hidden;display: block;z-index: 9999;}
#hamburger span {display:block;box-sizing: border-box;transition:all 0.5s ease;-webkit-transition:all 0.5s ease;width: 100%;height: 1px;background-color: #000; position: absolute; left: 0;}
#hamburger span:nth-of-type(1) {top: 2px;}
#hamburger span:nth-of-type(2) {top: 10px;}
#hamburger span:nth-of-type(3) {bottom: 2px;}
#hamburger.active {z-index: 99999;}
#hamburger.active span:nth-of-type(1) {background-color: #000; top: 0;-webkit-transform: translateY(10px) rotate(-45deg);transform: translateY(10px) rotate(-45deg);}
#hamburger.active span:nth-of-type(2) {background-color: #000;bottom:0;-webkit-transform: translateY(0) rotate(45deg);transform: translateY(0) rotate(45deg);}
#hamburger.active span:nth-of-type(3) {-webkit-transform: translateX(-100%);transform: translateX(-100%);}
#spNav {padding: 0px 0px 25px;display:none; background-color:#D0C5B0; z-index: 9999; position: fixed; top: 0; left: 0; width: 100%; height: 100%; overflow-y: auto;}
#spNav ul.nav {font-size:0; text-align: center; height:auto; text-align: left;padding: 50px 0px 25px;}
#spNav ul.nav li {margin-bottom:25px;display: block;font-size:24px; width: 100%;color: #313131;text-align: left;}
#spNav ul.nav li a {font-size: 30px;padding: 10px 25px;display: block;color: #313131;transition:all 0.5s ease;-webkit-transition:all 0.5s ease;font-family: 'Playfair Display', serif;font-weight:400;}
#spNav ul.nav li a:hover {color:#fff;;}
#spNav h1 {width: 210px; height: auto;margin:18px 25px 0px;border-top: none;}
#spNav .btn {display: block; width: 20px; height: 20px; position: absolute; top: 18px; right:20px;}
#spNav .btn a {display: block;width: 20px; position: relative;}
#spNav .btn a img {width: 20px;}
#spNav ul.sns  { height: 80px; text-align: center;}
#spNav ul.sns li {display: inline-block;}
#spNav ul.sns li a {font-size:24px;height: 50px;color: #000;text-align: center;display: block;padding: 30px 10px 0;line-height: 1em;transition:all .5s ease;-webkit-transition:all .5s ease;}
#spNav ul.sns li a:hover {color: #999;}
#footBtn { position: fixed; bottom:0; left: 0;width: 100%;z-index: 9999;min-width: auto;}
#footBtn ul { margin-left: -1px;}
#footBtn ul li {width:20%;height: auto;float: left;border-left: 1px solid #003954;}
#footBtn ul li a {height: 60px;letter-spacing: 0px;padding: 15px 0px 0;font-weight: 400;text-align: center;background-color:#004868;display: block;font-size: 10px; color: #FFF;}
#footBtn ul li a span {display:block;text-align: center;font-size: 10px; margin-bottom: 7px;letter-spacing: -0.5px;}
#footBtn ul li a img {display: block; width: 25px; height: auto;margin:0px auto 5px;}
#footBtn ul li a.hover { background-color:#003954; text-decoration: none;}
}