/* Scss Document */
@media screen and (min-width: 768px) {
  .pcNone {
    display: none !important;
  }
  html {
    width: 100%;
    height: 100%;
    font-size: 12px;
  }
  body {
    width: 100%;
    height: 100%;
    font-size: 1rem;
  }
  img {
    display: block;
    height: auto;
  }
  .left {
    float: left;
  }
  .right {
    float: right;
  }
  /* header */
  .header .headerContents .h1 {
    opacity: 1;
    transition: 0.5s;
  }
  .header .headerContents .h1.fo {
    opacity: 0;
  }
  .header .headerContents nav {
    display: none;
    width: 100%;
    position: fixed;
    right: 0;
    top: 0;
    padding: 6.5rem 0 9.5rem;
    z-index: 10;
  }
  .header .headerContents nav .nav {
    width: 600px;
    margin: 0 auto;
  }
  .header .headerContents nav .nav li {
    width: calc((100% - 1px) / 3);
    float: left;
    margin-top: 4.5em;
  }
  .header .headerContents nav figure {
    bottom: -1.75em;
  }
  .header .headerContents .fb {
    display: block;
    width: 2.25rem;
    height: 2.25rem;
    position: absolute;
    position: fixed;
    right: 10.75rem;
    top: calc(2.25rem + 1px);
    z-index: 9;
  }
  .header .headerContents .fb img {
    width: 2.25rem;
    height: 2.25rem;
  }
  .header .headerContents .fb .second {
    display: none;
  }
  .header .headerContents .fb.gray .first {
    display: none;
  }
  .header .headerContents .fb.gray .second {
    display: block;
  }
  .header .headerContents .insta {
    display: block;
    width: 2.25rem;
    height: 2.25rem;
    position: absolute;
    position: fixed;
    right: 6.75rem;
    top: calc(2.25rem + 1px);
    z-index: 9;
  }
  .header .headerContents .insta img {
    width: 2.25rem;
    height: 2.25rem;
  }
  .header .headerContents .insta .second {
    display: none;
  }
  .header .headerContents .insta.gray .first {
    display: none;
  }
  .header .headerContents .insta.gray .second {
    display: block;
  }

  /* footer */
  .footer .body {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    align-items: flex-start;
    /*text-align: center;*/
  }
  .footer .footer-info {
    width: 60%;
  }
  .footer .body p {
    /*display: inline-block;*/
    vertical-align: bottom;
  }
  .footer .body figure {
    display: inline-block;
    margin: 0 3.75em 0 2em;
  }
  .footer .body .read {
    display: block;
  }
  .footer .body .contact {
    margin: 0 0 0 2.25em;
  }
  .footer .map figure {
    width: 30%;
    float: left;
    padding-top: 30%;
  }
  .footer .map .gMap {
    width: 70%;
    float: left;
    padding-top: calc(42.8571% * 0.7);
  }
  .footer .tel span {
    font-size: 15px;
    padding-bottom: 10px;
  }
  .footer2 .body {
    width: 730px;
    margin: 3.5em auto 0;
  }
  .footer2 .logo {
    display: block;
    position: absolute;
    top: -1.75em;
    left: 0;
    z-index: 2;
  }
  .footer2 .logo img {
    height: 4rem;
  }
  .footer2 .read span {
    padding-left: 4rem;
  }
  .footer2 .read img {
    height: 1rem;
    margin: 0 auto;
  }
  .footer2 .read::after {
    background: none;
  }
  .footer2 .tel {
    position: absolute;
    right: 0;
    top: -2rem;
    z-index: 2;
  }
  .footer2 .tel img {
    height: 4rem;
  }
  .subPage .header {
    /*
			&::after{
				content: "";
				width: calc(100% - 8em);
				height: 1px;
				background: rgba(153,153,153,0.50);
				position: absolute;
				bottom: 0;
				left: 4em;
			}
      */
  }
  .subPage .header .mainImage {
    border-top: 1px solid rgba(153, 153, 153, 0.5);
  }
  .subPage .contents .a {
    width: 100%;
    max-width: 900px;
    padding-top: 8.89vw;
    margin: 4.25em auto 0;
    position: relative;
  }
  .subPage .contents .a .imgBox {
    width: 53%;
    padding-top: calc(89.54% * 0.53);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
  }
  .subPage .contents .a .txtBox {
    width: 56.78%;
    margin-left: 32.22%;
  }
  .subPage .contents .b {
    width: 100%;
    max-width: calc(((100vw - 900px) / 2) + (900px * 0.6778));
    margin: 2.25em 0 0 auto;
  }
  .subPage .contents .b .inner ul {
    margin: 0 4em 0 2.25em;
    position: relative;
  }
  .subPage .contents .b .inner ul li {
    width: 337px;
    float: left;
  }
  .subPage .contents .b .inner ul li:first-child {
    width: 211px;
    margin-right: 2.5em;
  }
  .subPage .contents .imgFxd {
    width: calc(100% - 8rem);
    height: calc((316 / 900) * (100vw   - 8rem));
    margin: 9.75em auto 0;
    background-attachment: fixed;
    background-size: 100%;
  }
  .subPage .contents .c {
    width: 674px;
    margin: 4em auto 0;
    border-top: 1px dotted #231815;
    border-bottom: 1px dotted #231815;
  }
  .subPage .contents .c > div {
    width: calc((100% - 3em) / 2);
  }
  .subPage .contents .c > div dl:last-child {
    border-bottom: none;
  }
  .subPage .contents .c > div dl dd img {
    position: absolute;
    right: 0.5em;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
  }
  .subPage .contents .ap {
    width: 100%;
    max-width: calc(900px + 8em);
    padding: 0 4em;
    margin: 9.5em auto 0;
  }
  .subPage .contents .ap .box {
    float: left;
    width: calc((100% - 4em) / 2);
  }
  .subPage .contents .ap .box:last-child {
    float: right;
  }
  .subPage .imgBox3 {
    margin: 5em 0 0;
  }
  .subPage .imgBox3 ul li {
    float: left;
    margin-right: 2.75em;
  }
  .subPage .imgBox3 ul li:nth-child(1) {
    width: 28.857%;
  }
  .subPage .imgBox3 ul li:nth-child(2) {
    width: 50.392%;
  }
  .slide .thum ul {
    width: 100% !important;
  }
  .slide .thum ul li {
    width: calc((100% - 6em - 1px) / 5);
    height: 6rem;
  }
  .slide .thum ul li:nth-child(5n) {
    margin-right: 0;
  }
  /* index */
  #index {
    height: 100vh;
    overflow-y: hidden;
  }
  #index .contents .info {
    position: fixed;
    bottom: 2.5rem;
    left: 4em;
    z-index: 2;
  }
  #index .contents .info li {
    margin: 0 3em 0 0;
    float: left;
    cursor: pointer;
  }
  #index .contents .info li img {
    height: 5rem;
  }
  #index .contents .info li.on {
    opacity: 0;
  }
  #index .contents .newsBox {
    display: none;
    width: 100%;
    height: 16rem;
    background: #FFF;
    color: #4d4d4d;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 4;
  }
  #index .contents .newsBox .close {
    padding: 0 0 0 1.5rem;
    background: url(../img/close.png) left top 1px/1rem no-repeat;
    letter-spacing: 0.075em;
    cursor: pointer;
    position: absolute;
    top: 2.5rem;
    right: 2.5rem;
  }
  #index .contents .newsBox ul li {
    display: table;
    width: 100%;
    margin: 0.5em 0;
  }
  #index .contents .newsBox ul li span {
    display: table-cell;
  }
  #index .contents .newsBox ul li .date {
    width: 10rem;
    letter-spacing: 0.025em;
    line-height: 1.5;
  }
  #index .contents .newsBox ul li .txt {
    letter-spacing: 0.075em;
    line-height: 1.5;
  }
  #index .contents .tourBox {
    display: none;
    width: 100%;
    height: 16rem;
    background: #FFF;
    color: #4d4d4d;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 4;
  }
  #index .contents .tourBox .close {
    padding: 0 0 0 1.5rem;
    background: url(../img/close.png) left top 1px/1rem no-repeat;
    letter-spacing: 0.075em;
    cursor: pointer;
    position: absolute;
    top: 2.5rem;
    right: 2.5rem;
  }
  #index .contents .tourBox ul li {
    display: table;
    margin: 0.5em auto;
  }
  #index .contents .tourBox ul li .txt {
    display: table-cell;
    letter-spacing: 0.025em;
    line-height: 1.5;
  }
  #index .contents .tourBox ul li a {
    display: table-cell;
    width: 10rem;
    padding-left: 1em;
    letter-spacing: 0.025em;
  }
  #index .contents .newsBox ul {
    width: 100%;
    max-width: 460px;
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
  }
  #index .contents .newsBox .title {
    height: 5rem;
    position: absolute;
    left: 5.5rem;
    top: 0;
    bottom: 0;
    margin: auto 0;
  }
  #index .contents .newsBox .title img {
    height: 5rem;
  }
  #index .contents .tourBox ul {
    margin: 0 auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
  }
  #index .contents .tourBox .title {
    height: 5rem;
    position: absolute;
    left: 5.5rem;
    top: 0;
    bottom: 0;
    margin: auto 0;
  }
  #index .contents .tourBox .title img {
    height: 5rem;
  }
  #index .contents .section .box {
    width: calc((3 / 10) * 100vw);
    color: #FFF;
    position: absolute;
    top: 50%;
    left: 10em;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
  }
  #index .contents .section .box .catch img {
    width: 100%;
  }
  #index .contents .section .box .txt {
    margin-top: 3vw;
  }
  #index .contents .section .box .txt img {
    width: 100%;
  }
  #index .contents .section:nth-child(even) .box {
    left: initial;
    right: 10em;
  }
  #index .footer {
    /*height: 100vh;*/
    position: relative;
  }
  #index .footer .body {
    /*margin: auto;*/
    /*position: absolute;*/
    /*top: 50%;*/
    /*left: 0;*/
    /*right: 0;*/
    /*transform: translateY(-50%);*/
  }
  #index .footer .body .insta {
    margin: 0;
    position: absolute;
    bottom: calc(0px - 2.5rem - 25px);
    left: 0;
  }
  #woodhouse .contents .imgBox2 {
    margin-top: 5em;
  }
  #woodhouse .contents .imgBox2 + h2 {
    margin-top: 9.75rem;
  }
  #about .contents {
    width: 595px;
    margin: 0 auto;
  }
  #about .contents .table1 {
    width: 50%;
    float: left;
  }
  #achievement .contents {
    width: 720px;
    margin: 0 auto;
  }
  #achievement .contents .slide .image li span br {
    display: none;
  }
  #search .header::after {
    background: none;
  }
  #search .contents {
    width: 720px;
    margin: 0 auto;
  }
  #contact .post {
    width: 640px;
    margin: 0 auto;
  }
  #notFound .post {
    width: 640px;
    margin: 0 auto;
  }
  #news .contents {
    width: calc(100% - 8em);
    margin: 0 auto;
  }
  #news .contents .sideNav {
    width: 160px;
    float: left;
  }
  #news .contents .sideNav ul li {
    margin: 3em 0 0;
  }
  #news .contents .sideNav ul li:first-child {
    margin-top: 4em;
  }
  #news .contents .main {
    width: calc(100% - 160px - 4em);
    float: left;
    margin-left: 4em;
  }
}
