@charset 'utf-8';
/*	Cascading Style Sheets: style.css 5.2	*/

/* 追加 */
.MAIN_IMG {margin-bottom: 70px;margin-top: 70px;background-image: url(https://www.will-produce.com/yakiyama/location/img/location_main.jpg);background-repeat:no-repeat;background-attachment: fixed;background-position: right bottom;height: 350px;background-size: cover; display:none;}
.H_LOCATION { color:#02AFA8; }
header.scroll-nav .logo, header.scroll-nav ul li a.H_LOCATION { color:#02AFA8; }
.circle { background-color: #3d3d3d; color: #fff; border:#3d3d3d; }


/*ボタン*/
.BUTTONS{display: flex;justify-content: center;margin-bottom: 70px;}
.btn{position: relative;overflow: hidden;text-decoration: none;display: inline-block;border: 2px solid #555;text-align: centeroutline nonetransition ease .2s;width: 275px;text-align: center;margin: 10px;padding: 10px 0;box-shadow: 2px 2px 4px #ccc; line-height:1px; }
.btn span {position: relative;z-index: 3;color:#333;font-size: 19px;
    letter-spacing: 2px; line-height:6px;}
.btn:hover span{color:#fff;}
.bgskew::before {content: '';position: absolute;top: 0;left: -130%;background:#333;width:120%;height: 100%;transform: skewX(-25deg);}
.bgskew:hover::before {animation: skewanime .5s forwards;}
.btn.bgskew span {
    line-height: 1; /* 行間を詰める */
}
@keyframes skewanime {100% {left:-10%;}}
.BUTTONS small{font-size: 13px;}

/*SPOT*/
.SPOT_ENG{ width:1040px; margin:0 auto; font-size: 40px;letter-spacing: 3px;font-weight: 500; color: rgba(81, 78, 95, 0.23); text-emphasis: center; text-align: center; }
.SPOT_MAIN{position: relative;}
.SPOT_MAIN_IMG{width: 1000px;}
.SPOT_MAIN_BOX{width: 400px; background: white;letter-spacing: 2px;padding: 50px;position: absolute;top: 17px;left: 55vw;}
.SPOT_MAIN_BOX_TYTLE{font-size: 17px;font-weight: 600;margin-bottom: 15px;}
.EDU_MAIN{float: right;margin-bottom: 50px;}
.EDU_BOX {left: -21vw;}

.SPOTS{width: 1040px;display: flex;flex-wrap: wrap;margin: 0 auto;margin-top: 30px;margin-bottom: 80px;}
.SPOT{margin: 10px; margin-bottom: 20px;}
.SPOT_IMG{width: 240px;margin-bottom: 5px;}
.SPOT_NAME{font-size: 16px; letter-spacing: 2px; line-height:1.5em; }
.SPOT_MAIN_BOX_TEXT{text-align: justify;}

/*VOICE*/
.VOICE_WRAP{padding: 50px 0; background:#dbdbdb; }
.TYTLE{text-align: center;}
.TYTLE_ENG{font-size: 65px;font-size: 61px;letter-spacing: 6px;}
.TYTLE_JAP{letter-spacing: 2px;font-size: 16px; width: 90%; text-align: center;  margin: 0 auto; color: #000;}
.VOICE{background: white;width: 500px;padding: 40px 45px;letter-spacing: 2px;margin: 0 20px;margin: 25px 20px;border-radius: 35px;}
.VOICES{width: 1080px;margin: 0 auto;display: flex;flex-wrap: wrap;margin-top: 20px;}
.VOICE_COPY{font-size: 18px;font-weight: bold;margin-bottom: 15px;}
.VOICE_TEXT{border-bottom: 1px solid #ccc; padding-bottom: 20px;}
.VOICE_NAME{padding-top: 20px;}

/*ACCESS*/
.MAP iframe{width: 900px;margin: 0 auto;}
.MAP{margin-top: 30px;text-align: center;margin-bottom: 0px;}
.ACCESS_WRAP{width: 900px;margin: 0 auto;margin-top: 70px;margin-bottom: 70px;}
.ACCESS_TYTLE{position:relative;font-weight: bold;letter-spacing: 1px;font-size: 18px;margin-bottom: 10px;padding-left: 10px;padding-left: 20px;}
.ACCESS_TYTLE::before {content: "";display: inline-block;width: 5px;height: 24px;background-color: #161616;position: absolute;top: 2px;left: 0px;}
.ACCESS_BOX{padding: 0;background: white;}
.ACCESS_BOX_IMG{ margin: 0 auto;}
.ACCESS_BOX_IMG img { width:90%; margin:0 auto; }
.ACCESS_DETAIL{margin-top: 10px;}
.P_CENTER { width:90%; margin:0 auto; text-align: center; margin-top:20px; }

/*PC・SP*/
.pc{display: block;}
.sp{display: none;}




@media screen and (max-width: 740px){
 
/* 追加 */
.MAIN_IMG {background-image: none;height: auto;margin-top: 40px;margin-bottom: 0px;}
.H_TOP { color:#fff; }
.H_PLAN  { color:#fff;}
.H_GALLERY  { color:#fff;}
.H_EQUIPMENT { color:#fff; }
.H_LOCATION { color:#F7ED82;  }
.H_OUTLINE { color:#fff; }
.H_CONTACT { color:#fff; }


/*ボタン*/
.BUTTONS{width: 93vw;margin: 0 auto;margin-bottom: 70px;flex-wrap: wrap;justify-content: flex-start; margin-top:30px; }
.btn{margin: 1vw;width: 43vw;}
.BUTTONS small {font-size: 12px;letter-spacing: 1px;}

/*SPOT*/
.SPOTS{width: 90vw;}
.SPOT_ENG {font-size: 50px;line-height: 32px; width:100%; }
.SPOT_MAIN{position: initial;}
.SPOT_MAIN_IMG{width: 100vw;}
.SPOT_MAIN_BOX {width: 90vw;background: none;padding: 0px;position: initial;margin: 0 auto;margin-top: 30px;text-align: justify;}
.SPOT{margin: 0;margin-bottom: 30px;}
.SPOT_IMG{width: 90vw;}

/*VOICE*/
.TYTLE_ENG {font-size: 50px;}
.VOICES{width: 89vw;}
.VOICE{padding: 30px 8vw;margin: 15px 0;}
.VOICE_COPY {font-size: 17px;}
.VOICE_TEXT {padding-bottom: 10px;text-align: justify;}
.VOICE_NAME {padding-top: 10px;text-align: justify;}

/*ACCESS*/
.MAP iframe{width: 100vw;}
.ACCESS_WRAP{width: 95vw;}
.ACCESS_BOX{border: none;width: 95vw;padding: 20px 0 40px 0;}
.ACCESS_BOX_IMG{width: 95vw;}
.BT{border-top: 1px solid;padding-top: 70px;}
.ACCESS_BOX_IMG img { width:100%; }
.MAP iframe { height:400px; }

/*PC・SP*/
.pc{display: none;}
.sp{display: block;}
#footer span.pc{display: none;}
#footer span.sp{display: block;}
#footer strong a{display: flex;justify-content: center;align-items: center;}
#footer strong a img{height: 24px;}


}