@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Crimson+Text:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&family=Zen+Old+Mincho&display=swap');

body { font-family: "Zen Old Mincho", serif; font-weight: 400; margin: 0; padding: 0; color: #57595d; }

a { color: #6699cc; text-decoration: underline; }
a:hover { color: #6699cc; text-decoration: none; }

header { width: 100%; height: 90px; position: relative; margin: 10px 0 0; padding: 0; }
h1 { height: 100%; margin: 0; }
h1 img { position: absolute; top: 50%; left: 40px; -webkit-transform: translateY(-50%); max-width: 100px; }
h2 { position: absolute; top: 53%; right: 40px; -webkit-transform: translateY(-50%); font-size: 80%; }
nav ul li a { text-decoration: none; color: #57595d; }
nav ul li a:hover { text-decoration: none; color: #37393b; }
nav ul li { font-size: 90%; float: left; margin-left: 30px; }
nav { position: absolute; top: 53%; left: 150px; -webkit-transform: translateY(-50%); }

.slick-prev:before,.slick-next:before { color: rgba(0,0,0,0.5); }
.slick-next { right: 10px; }
.slick-prev { left: 10px; z-index: 1; }
.slick-dots { bottom: 10px; }

@media only screen and (max-width:769px){
h1 img { left: 20px; }
nav { right: 20px; left: auto; }
nav ul li { margin-left: 15px; font-size: 70%; }
h2 { opacity: 0; display: none; }
}

/*base*/

html { height: 100%; }
body { height: 100%; margin: 0; }
div#top-content { height: calc(100% - 90px); }
div.slick-wrapper,div.slick-fade,div.slick,div.slick-slide,div.slick-list,div.slick-track { width: 100%; height: calc(100% - 0px); }

div.slick-dotted.slick-slider { margin-bottom: 0; }
ul.slick-dots { bottom: 20px; }


div.photo2 { background: url("../img/slide-2.jpg") center; background-size: cover; }
@media only screen and (max-width:769px){div.photo2 { background: url("../img/slide-2_sp.jpg") center no-repeat; background-size: cover; }}
div.photo1 { background: url("../img/slide-1.jpg") center; background-size: cover; }
@media only screen and (max-width:769px){div.photo1 { background: url("../img/slide-1_sp.jpg") center no-repeat; background-size: cover; }}


/*common*/

section#content { width: 90%; margin: 0 auto; padding: 60px 0 100px 0; max-width: 1440px; }
@media only screen and (max-width:769px){section#content { padding: 0 0 100px 0; margin: 40px auto 0; }}
a img { transition: opacity 0.3s ease; }
a:hover img { opacity: 0.6; filter: saturate(0%); }

section#content p { font-size: 100%; line-height: 200%; letter-spacing: 0px; }
section#content p span { font-size: 160%; letter-spacing: 0px; }

@media only screen and (max-width:769px){section#content p { font-size: 100%; line-height: 180%; }}

/*work*/

section#content.work { width: min(92vw, 1280px); }
section.work div { width: 50%; display: block; float: left; }
/* 奇数番目 */
section.work div:nth-child(odd) { padding: 3% 4% 4% 0; }
/* 偶数番目 */
section.work div:nth-child(even) { padding: 3% 0 4% 4%; }

@media only screen and (max-width:769px){
section.work div:nth-child(odd) { width: 100%; display: block; float: none; padding: 4%; }section.work div:nth-child(even) { width: 100%; display: block; float: none; padding: 4%; }}
section.work div img { width: 100%; display: block; }

/*about*/

section#content.about { max-width: 980px; margin: 100px auto 0; }
section#content.about p img { width: 200px; }
section#content.about p { line-height: 200%; }
section#content p span.marker{ font-size: 100%; display: inline; line-height: 1.4; padding: 0 .15em; background: linear-gradient(#69c3, #69c3) 0 calc(100% - .12em) / 100% .55em no-repeat; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
section#content.about span.aboutline { border-top: 1px solid #ccc; margin: 40px 0; display: block; }

@media only screen and (max-width:769px){
section#content.about p { line-height: 180%; }
}

/*news*/

section#content.news { max-width: 980px; margin: 100px auto 0; font-size: 125%; }
section#content.news table tr td p { font-size: 150%; font-weight: 400; margin-bottom: 40px; }
section#content.news table { width: 100%; }
section#content.news table tr th { width: 300px; text-align: left; font-size: 80%; color: #999; }
section#content.news table tr td { width: calc(100% - 300px); font-size: 80%; border-bottom: 1px solid #ddd; padding: 70px 0; line-height: 200%; }
@media only screen and (max-width:769px){
section#content.news table tr td p { margin: 0 0 20px; }
section#content.news table tr th { width: 100%; display: block; padding: 30px 0 0; }
section#content.news table tr td { width: 100%; display: block; padding: 0 0 40px; line-height: 180%; }
}

/*contact*/

section#content.contact { max-width: 980px; margin: 100px auto 0; }
section#content.contact img { display: block; margin: 60px auto; }
section#content.contact table { width: 100%; }
section#content.contact table tr th { width: 300px; text-align: left; font-size: 100%; }
section#content.contact table tr th span { display: block; float: right; margin-top: 3px; margin-right: 40px; color: #fff; background-color: #595a5c; font-size: 65%; padding: 3px 6px; }
section#content.contact table tr th span.req { background-color: #6699cc; }
section#content.contact table tr td { width: calc(100% - 300px); font-size: 100%; padding: 15px 0; }
section#content.contact table tr td input:focus { outline: 1px solid #6699cc; }
section#content.contact table tr td textarea:focus { outline: 1px solid #6699cc; }
section#content.contact table tr td input { border: /*1px solid #bdb7b5*/none; width: 100%; height: 40px; background-color: #f2f2f2; padding: 10px 20px; }
section#content.contact table tr td textarea { border: /*1px solid #bdb7b5*/none; width: 100%; height: 200px; background-color: #f2f2f2; padding: 10px 20px; resize: none; }
section#content.contact table tr td p { font-size: 80%; margin: 30px 0; }
section#content.contact table tr td input.button { border: /*1px solid #bdb7b5*/none; display: block; width: 200px; height: auto; background-color: #f2f2f2; padding: 15px 20px; transition: 0.3s ease; cursor: not-allowed; opacity: 0.6; }
section#content.contact table tr td input.button.active { background-color: #6699cc; color: #fff; cursor: pointer; opacity: 1; }
section#content.contact table tr td input.button.active:hover { opacity: 0.7; }
section#content.contact div.thanks p { text-align: center; }
section#content.contact table tr td.thanks { text-align: center; padding: 60px 0; }
section#content.contact table tr td button.send { background: #6699cc; min-width: 200px; }
section#content.contact table tr td button { display: inline-block; padding: 10px 20px; background: #5A5B5C; color: #fff; text-decoration: none; transition: 0.3s ease; min-width: 150px; }
section#content.contact table tr td button:hover { opacity: 0.7; }
.error-list { color: #ff0000; }
div.privacy { max-height: 200px; margin-bottom: 83px; overflow: scroll; background-color: #f6f6f6; padding: 40px; margin: 16px 0 0 0; font-size: 80%; overflow-x: auto; word-break: break-word; }
div.privacy b { font-size: 200%; }
div.privacy span { font-size: 120%; font-weight: bold; }

@media only screen and (max-width:769px){
section#content.contact table tr th span { margin: 0 0 10px; }
section#content.contact table tr th { width: 100%; display: block; padding: 0; }
section#content.contact table tr td { width: 100%; display: block; padding: 0 0 40px; }
}