@charset "utf-8";
/* reset */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { padding: 0; margin: 0; }
table { border-collapse: collapse; border-spacing: 0; }
fieldset, img { border: 0; }
address, caption, cite, code, dfn, em, var { font-style: normal; font-weight: normal; }
ol, ul { list-style: none; }
caption, th { text-align: left; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
q:before, q:after { content: ''; }
abbr, acronym { border: 0; }
section, article { display: block; }
/* base */
html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; text-align: center; letter-spacing: 1px; margin: 0px; padding: 0px; font-size: 14px; height: 100%; background-color: #f5f5f5; }
img { vertical-align: bottom; height: auto; width: 100%; max-width: 100%; }
/* link */
a:link, a:visited, a:active { color: #000000; text-decoration: none; }
a:hover { text-decoration: none; color: #000000; filter: alpha(opacity=60); opacity: 0.6; }
a:hover img { text-decoration: none; color: #000000; filter: alpha(opacity=80); opacity: 0.8; }
/* clear */
.clear { clear: both; }
.cbox { zoom: 100%; }
.cbox:after { content: " "; clear: both; height: 0; display: block; visibility: hidden; }

.forPC{
display:block;
}
.forSP {
display:none;
}

/* styles */
#contents h1 { font-size: 1.8em; font-weight: bold; margin-bottom: 1em; clear: both; margin-top: 2em; text-align: left; }
#contents h2 { font-size: 1.6em; font-weight: bold; margin-bottom: 1em; clear: both; margin-top: 2em; text-align: left; }
#contents h3 { font-size: 1.4em; font-weight: bold; margin-bottom: 1em; clear: both; margin-top: 2em; text-align: left; }
#contents h4 { font-size: 1.2em; font-weight: bold; margin-bottom: 1em; clear: both; margin-top: 2em; text-align: left; }
#contents h5 { font-size: 1em; font-weight: bold; margin-bottom: 1em; clear: both; margin-top: 2em; text-align: left; }
#contents h6 { font-size: 0.8em; font-weight: bold; margin-bottom: 1em; clear: both; margin-top: 2em; text-align: left; }
#contents p { font-size: 1em; margin-bottom: 2em; clear: both; text-align: left; }
#contents sup { font-size: 1em; font-weight: bold; margin-bottom: 2em; clear: both; text-align: left; }
#contents table { width: 100%; margin-bottom: 2em; margin-top: 2em; text-align: left; }
#contents blockquote { padding: 5%; margin-top: 2em; margin-bottom: 2em; border: 1px solid #333333; font-style: italic; }
#contents th { font-size: 1em; line-height: 1.5em; font-weight: bold; padding: 10px; text-align: left; }
#contents td { font-size: 1em%; line-height: 1.5em; padding: 10px; text-align: left; }
#contents ul { margin-bottom: 2em; overflow: hidden; text-align: left; }
#contents dt { font-size: 1em; line-height: 1.5em; display: block; margin-bottom: 20px; text-align: left; }
#contents dd { font-size: 1em; line-height: 1.5em; display: block; margin-bottom: 20px; text-align: left; }
#contents img { max-width: 100%; height: auto; }
#contents .wp-caption.alignleft { float: left; }
#contents .wp-caption.alignleft .wp-caption-text { font-size: 0.8em; }
#contents .wp-caption.alignright { float: right; }
img.centered { display: block; margin-left: auto; margin-right: auto; }
img.alignright { padding: 0px; margin: 0 0 20px 2%; display: inline; max-width: 47%; }
img.alignleft { padding: 0px; margin: 0 20px 2% 0; display: inline; max-width: 47%; }
.aligncenter { margin-top: 15px; margin-bottom: 15px; margin-right: auto; margin-left: auto; }
.alignright { float: right; margin-bottom: 20px; margin-left: 20px; }
.alignleft { float: left; margin-bottom: 20px; margin-right: 20px; }
img.aligncenter { display: block; }
.clear { clear: both; }
/* layout */
#wrapper { margin-right: auto; margin-left: auto; height: 100%; }
section { max-width: 90%; display: block; margin-right: auto; margin-left: auto; }
/* header */
header { margin-right: auto; margin-left: auto; width:95%; display: block; }
.logo h1 { width: 16%; margin-right: auto; margin-left: auto; margin-top: 9.5em; margin-bottom: 10.5em; }
.logo_title h1 { width: 95%; margin-right: auto; margin-left: auto; margin-top: 5em; margin-bottom: 6em; }
.post { float: right; margin-top: 2.5em; font-size: 80%; }
.post p { width:14px; height:auto; float:left; margin-left:15px; }
.post p a {text-decoration:none;}
.navi { float:left; margin-top: 2em; }
.navi li { font-size: 115%; line-height: 1em; text-align: left; font-weight: bold; margin-left: 0.75em; display: inline-block; padding-right: 0.75em; border-right-width: 1px; border-right-style: solid; border-right-color: #000; }

.navi li:nth-child(6) { border-right-style: none; }
/* home */

.photo_1st { max-width: 90%; display: block; margin-right: auto; margin-left: auto; margin-bottom: 2em; }
.photo { max-width: 90%; display: block; margin-right: auto; margin-left: auto; margin-top: 2em; margin-bottom: 2em; }
.photo_last { max-width: 90%; display: block; margin-right: auto; margin-left: auto; margin-top: 2em; margin-bottom: 500px; }
dl.underLine {border-bottom: 3px solid #000; width: 200px; padding: 0 0 3px 0;}
/* about */
.about { max-width: 65%; display: inline-block; padding-top: 7em; padding-bottom: 9em; text-align: left; }
.about dl { max-width: 35%; display: inline-block; }

.about dl:nth-child(2) { max-width: 60%; display: inline-block; float: right; }
.about dl dt { font-size: 200%; font-weight: bold; letter-spacing: 0.5px; }
.about dl span { font-size: 115%; font-weight: bold; padding-left: 0.3em; letter-spacing: 0.5px; }
.about dl dd { line-height: 2em; margin-top: 1em; letter-spacing: 1px; margin-bottom: 1em; }

.history { max-width: 65%; display: inline-block; padding-top: 0em; padding-bottom: 9em; text-align: left;width: 100%; }
.history.p9 {padding-top:9em;}
.history dl { max-width: 30%; display: inline-block; }
.history dl span {
    font-size: 50%;
    font-weight: bold;
    padding-left: 1.3em;
    letter-spacing: 0.5px;
}
.history dl dt {
    font-size: 200%;
    font-weight: bold;
    letter-spacing: 0.5px;
}
.history dl dd {
    line-height: 2em;
    margin-top: 1em;
    letter-spacing: 1px;
    margin-bottom: 1em;
}
.history dl dt:nth-child(2) {
    padding-top: 1em;
}
.history dl:nth-child(2) {
    max-width: 60%;
    display: inline-block;
    float: right;
        width: 60%;
}

/* sectionText */
.sectionText { max-width: 65%; display: inline-block; padding-top: 7em; padding-bottom: 9em; text-align: left; }
.sectionText dl { max-width: 35%; display: inline-block; }

.sectionText dl:nth-child(2) { max-width: 60%; display: inline-block; float: right; }
.sectionText dl dt { font-size: 200%; font-weight: bold; letter-spacing: 0.5px; }
.sectionText dl span { font-size: 115%; font-weight: bold; padding-left: 0.3em; letter-spacing: 0.5px; }
.sectionText dl dd { line-height: 2em; margin-top: 1em; letter-spacing: 1px; margin-bottom: 1em; }
.sectionText dl dd a { text-decoration:underline; }



/* work */
.work { max-width: 65%; display: inline-block; padding-top: 7em; text-align: left; }
.work:nth-child(12) { padding-bottom: 9em; }
.work dl { max-width: 28%; display: inline-block; }
.work dl dt:nth-child(2) { padding-top: 1em; }
.work dl:nth-child(2) { max-width: 60%; display: inline-block; float: right; }
.work dl dt:nth-child(1) { font-size: 200%; font-weight: bold; letter-spacing: 2px; }
.work dl dd { line-height: 2em; margin-top: 1em; letter-spacing: 1px; }
.work dl dd:nth-child(3) { font-size: 80%; margin-top: 2em; margin-bottom: 2em; line-height: 1.8em; letter-spacing: 1px; }
.work dl span { font-size: 80%; font-weight: bold; padding-left: 3em; letter-spacing: 0.5px; vertical-align: middle; }
.work dl dd a span { font-size: 115%; font-weight: bold; line-height: 1.8em; letter-spacing: 1px; padding-left: 0; padding-bottom: 0.25em; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #000; }
/* profile */
.profile { max-width: 65%; display: inline-block; padding-top: 7em; text-align: left; }
.profile:nth-child(17) { padding-bottom: 9em; }
.profile dl { max-width: 28%; display: inline-block; }
.profile dl:nth-child(2) { max-width: 60%; display: inline-block; float: right; }
.profile dl dt:nth-child(2) { font-size: 200%; font-weight: bold; letter-spacing: 2px; }
.profile dl dd { line-height: 2em; margin-top: 1em; letter-spacing: 1px; }
.profile dl span { font-size: 50%; font-weight: bold;
    padding-left: 2em;
    letter-spacing: 0.5px;
    vertical-align: middle;
}
.recruit {
width: 50%;
    padding-top: 7em;
    padding-bottom: 7em;
    text-align: left;
}
.recruit dl dt
{ font-size: 160%; font-weight: bold; letter-spacing: 2px; }
.recruit dl dd { line-height: 2em; margin-top: 1em; letter-spacing: 1px; }
/* company */
.company { max-width: 85%; display: inline-block; padding-top: 7em; padding-bottom: 9em; text-align: left; }
.company dl { max-width: 45%; display: inline-block; }
.company dl dt { font-size: 150%; font-weight: bold; letter-spacing: 1px; line-height:1.7em; }
.company dl dd { font-weight: bold; line-height: 2em; letter-spacing: 1px; }
.company dl:nth-child(2) { max-width: 50%; display: inline-block; float: right; }
.company dl dd:nth-child(4) { font-size: 80%; font-weight: bold; letter-spacing: 0.5px; }
.company dl dd p { font-size: 80%; font-weight: bold; line-height: 1.5em; letter-spacing: 0.5px; }

/* gallery */
.gallery_title { width: 100%; }
.gallery_title h2 { font-weight: bold; font-size: 200%; text-align: center; margin-bottom:1.5em; }
.gallery { max-width: 90%; display: block; margin-right: auto; margin-left: auto; margin-bottom: 2em; }
.gallery ul li { float: left; width: 23.5%; margin-right: 2%; margin-bottom: 2%; }
.gallery ul li:nth-child(4n) { float: left; margin-right: 0; }
.gallery ul li:nth-child(4n+1) { clear:both; }

/* gallery_detail */
#banner { position: fixed; right: 1.8%; bottom: 4%; width: 115%; display:none; }
#wrapper .works_text { float: left; width: 20%; margin-right: 3%; text-align: left; display: block; }
#wrapper .works_photo { width: 77%; float: right; display: block; margin-bottom:3em; }
#contents { width: 90%; text-align: center; margin-right: auto; margin-left: auto; }
.works_text .title { font-size: 150%; font-weight:bold; }
.works_text p span { font-weight:bold; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #000; padding-bottom: 5px; }
#wrapper #contents .clear { clear: both; }


.cpArea { max-width: 65%; width: 65%; display: inline-block; padding-top: 7em; padding-bottom: 7em; text-align: left; }
.cpArea div:nth-child(1) { width: 40%; display: inline-block; float: left; }
.cpArea div:nth-child(2) { width: 58%; display: inline-block; float: right; }
.cpArea div {
line-height: 2em;
    margin-top: 1em;
    letter-spacing: 1px;
    margin-bottom: 1em;
    }


/* スライドショーCSSここから*/
.slideshowbox {
    position: relative;
    width: 100%;
    height: auto;
}
.ratio-1_1:before {
    content: "";
    display: block;
    padding-top: 70%; /* 1:1 */
}
.slideshow {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
}





.slideshow {
  width: 100%; 
  list-style-type: none;
}

.slideshow > li {
  opacity: 0;
  position: absolute;
  transition: opacity 3s ease-in-out;
  width: 100%;
    height: 100%;
    top: 0; left: 0;
}

.slideshow > li.showSlide {
  opacity: 1;
}

.slideshow > li > img {
  width : 100%;
  height: auto;
}

/* SP用メディアクエリ */
@media screen and (max-width:600px){
  .slideshow{
    width: 100%;
  }
}

/* footer */
footer { max-width: 75%; display: inline-block; text-align: center; }
.footer_logo { width: 100%; margin-right: auto; margin-left: auto; margin-top: 6em; padding-bottom: 8.5em; }
footer .copyright {margin-top: 1em;}

/* current */
.nav-btn.current span { display: inline-block; text-decoration: none; color: #000000; filter: alpha(opacity=40); opacity: 0.4; }
.btn  {
 font-family: FontAwesome;
 content: "\f105";
}


/* sp */
@media screen and (max-width: 1380px) {
body { font-size: 14px; }
}
@media screen and (min-width: 1381px) and (max-width: 1450px) {
body { font-size: 15px; }
}
@media screen and (min-width: 1451px) and (max-width: 2560px) {
body { font-size: 16px; }
}