@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200..900&display=swap');

/*.subpage::before {
	background-image: none!important;
}*/
.mv-heading.hellowoods-mv-heading .heading-subtext{
	font-family: "Noto Serif JP", serif;
    height: auto;
	color: #fff;
	font-size: 60px;
	width: auto;
	max-width: initial;
	font-weight: normal;
	line-height: 120%;
	text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.4);
}

.heading .heading-subtext img {
    width: auto;
    height: 100%;
}

p.heading-subtext {
	display: inline-block;
    position: relative;
    font-size: 28pt;
    margin: 10px auto 25px;
    letter-spacing: 0.15em;
    font-family: "Noto Serif JP", serif;
    font-weight: 600;
}

@media screen and (max-width: 749px) {
	p.heading-subtext:not(:root) {
	    display: block;
        font-size: 20pt;
        margin: 5px auto 30px;
        letter-spacing: 0;
        font-family: "Noto Serif JP", serif;
        font-weight: 600;
		height: auto;
	}
}

.button {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    margin: 0 auto;
    width: 430px;
    height: auto;
    font-size: 16px;
    font-weight: bold;
    color: #333;
    border: 1px dotted #333;
    position: relative;
    letter-spacing: 0.08em;
	padding: 10px;
	background: #fff;
}

.button span {
	position: relative;
}

.subpage-title.green span{ background: -webkit-gradient(linear, left top, right top, from(#479e09), to(#ff9d00)); background: linear-gradient(to right, #479e09 0%, #ff9d00 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: inline-block;}

.is-ie .subpage-title.green span{ background: none; color: #f29900; -webkit-text-fill-color: #f29900; -moz-text-fill-color: #f29900; -ms-text-fill-color: #f29900;}


@media screen and (min-width: 750px){
br.sp{ display: none;}
img.sp{ display: none;}
    
    
/*-- メインビジュアル下リード --*/
.challenge .challenge-img1{ top: auto;}
.challenge .challenge-img2{ top: auto; margin-top: -88px;}
.challenge .challenge-img3{ top: auto; margin-top: -86px;}
.challenge-left{ margin-top: -46px;}
.challenge-right{ display: flex; flex-direction: column; justify-content: center;}
	
	.challenge-right.events .heading-text {
		font-family: "Noto Serif JP", serif;
		display: block;
		background: -webkit-gradient(linear, left top, left bottom, color-stop(10%, #027cc3), to(#099f48));
		background: linear-gradient(to bottom, #027cc3 10%, #099f48 100%);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		font-size: 33pt;
		letter-spacing: 0.15em;
		font-weight: 800;
	}
	
.mv::after { content: ''; position: absolute; bottom: -46px; left: 0; width: 100%; height: 134px; background: url("../images/events/mv-curve.png") no-repeat center top; background-size: cover;}
    
.mv-heading.hellowoods-mv-heading .heading-subtext{
	margin-bottom: 10px;
	
	}
.mv.mv-events {
    margin-bottom: 160px;
}
	
	.scroll_down {
		display: none;
	}
	
    
.subpage-image-gallery.pcmb00{ margin-bottom: 0;}
.goods-shop-list.events-list .events-list-item.bdr { border-bottom: 1px solid #dfdfdf !important; }
	
.bnrBox{ width: 980px; margin: 130px auto 120px; text-align: center; padding: 0;}
.bnrBox a{ display: block; transition: all 0.5s; margin-bottom: 60px; position: relative;}
.bnrBox a .bnr-caution{ display: block; margin-top: 15px; font-size: 16px; text-align: center; color: #333;}
.bnrBox a:last-child{ margin-bottom: 0;}
.bnrBox a:hover{ opacity: 0.7;}
	.bnrBox .banner-text {
		position: absolute;
		font-weight: bold;
	}
	.bnrBox .banner-text.textFireworks {
		left: 120px;
		bottom: 40px;
		color: #fff;
		font-size: 25px;
	}
	.bnrBox .banner-text.textFireworks .small {
		display: block;
		font-size: 20px;
	}
	
	

.hashTagBox{ margin: 0 auto 35px; border: 3px solid #d5d5d5; padding: 25px 30px;}
.hashTagBox h4{ font-size: 20px; font-weight: bold; margin: 0 auto 10px; letter-spacing: 0.10em;}
.hashTagBox h4 span{ background-image: -webkit-gradient(0deg, #c3e8d8 19.44%, #ffffff 19.44%, #ffffff 50%, #c3e8d8 50%, #c3e8d8 69.44%, #ffffff 69.44%, #ffffff 100%);
background-image: linear-gradient(0deg, #c3e8d8 19.44%, #ffffff 19.44%, #ffffff 50%, #c3e8d8 50%, #c3e8d8 69.44%, #ffffff 69.44%, #ffffff 100%); background-size: 36.00px 50.00px;}
.hashTagBox .text{ font-size: 16px; font-weight: bold;}

.ttlSub{ padding: 30px; background: #f2faf5; text-align: center; font-size: 20px;  font-weight: bold; margin: 0 auto 50px; color: #333; width: 1020px;}
.ttlSub span{ font-size: 28px; color: #00a040;}

.ttlSub-blue{ padding: 30px; background: #eef9fc; text-align: center; font-size: 20px;  font-weight: bold; margin: 0 auto 50px; color: #333; width: 1020px;}
.ttlSub-blue span{ font-size: 28px; color: #2a95ca;}    
    
/*-- 終了対応
----------------------------------------------*/
#secInfo { width: 100%; padding: 30px 0 20px; margin: 0 auto; background: #F5F5F5; font-family: "ヒラギノ角ゴ Pro", "メイリオ", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, "-apple-system", "Helvetica Neue", "Yu Gothic", YuGothic, Verdana, Meiryo, sans-serif;}
#secInfo p { padding: 20px; width: 980px; text-align: center; font-size: 18px; color: #E50012; margin: 0 auto; line-height: 1; border: #E50012 solid 2px; box-sizing: border-box; background: #FFF;}
    
.otherCaution{ margin-top: 10px; font-size: 14px; line-height: 2; }
.desc-Caution{ margin: 10px 0 35px; font-size: 14px; line-height: 2;}
.mb00{ margin-bottom: 0 !important;}
.point-txt{ font-weight: bold; color: #00a040; margin: 30px 0 10px; font-size: 18px;}
.point-txt::before{ content: "\FF3C"; margin-right: 10px;}
.point-txt::after{ content: "\FF0F"; margin-left: 10px;}
    
/*-----------------------------
mainMap
-----------------------------*/
.mainMap{ width: 100%; padding: 20px 0 80px;}
.mainMap .innerMainMap{ width: 1200px; margin: 0 auto; text-align: center;}
.mainMap .innerMainMap h2{ font-size: 40px; color: #008899; margin:  0 auto 30px; font-weight: normal; letter-spacing: 3px;}
.mainMap .innerMainMap .text{ font-size: 18px; letter-spacing: 3px;}
.mainMap .innerMainMap .map-cau{ margin: 20px auto 0; font-size: 14px; }
.mainMap .innerMainMap .map-cau .map-cau-icon{ margin: 0 10px 0 0; display: inline-block; vertical-align: middle;}
.mainMap .innerMainMap .map-cau .map-cau-icon img{ width: 40px !important; }

.position-map{ width: 1200px; margin: 40px auto 80px; position: relative;}
	.map-base {text-align: center;}
.map-icon00{ position: absolute; top: 170px; left: 290px;}
.map-icon01-01{ position: absolute; top: 380px; left: 270px;}
.map-icon01-02{ position: absolute; top: 430px; left: 510px;}
.map-icon01-03{ position: absolute; top: 570px; left: 710px;}
.map-icon01{ position: absolute; top: 290px; left: 640px;}
.map-icon01 img { width: 90px; }
/* sumika
.map-icon02{ position: absolute; top: 400px; left: 280px;} */
.map-icon02{ position: absolute; top: 420px; left: 770px;}
.map-icon03{ position: absolute; top: 330px; left: 940px;}
.map-icon04{ position: absolute; top: 40px; left: 590px;}
.map-icon-camp{ position: absolute; top: 230px; left: 560px; width: 90px;}
.map-icon-food{ position: absolute; top: 360px; left: 890px; width: 90px;}
.map-icon-park{ position: absolute; top: 550px; left: 500px; width: 90px;}
.map-icon-cool01{ width: 90px; height: auto; position: absolute; top: 830px; left: 180px;}
.map-icon-cool02{ width: 80px; height: auto; position: absolute; top: 300px; left: 180px;}
.position-map a{ transition: all 0.7s;}
.position-map a:hover{ opacity: .7;}
    
/*-----------------------------
subEventList
-----------------------------*/
.subEventList li.subEvent{ width: 100%; box-sizing: border-box; margin: 0 auto 60px;}
.subEventList li.subEvent:last-child{ margin-bottom: 0;}
.subEventList .ttl{ font-size: 18px; font-weight: bold; margin: 0 0 15px;}
.subEventList .ttl::before{ content: "\25A0"; color: #00a040; margin-right: 7px;}
    
/*-----------------------------
ID margin
-----------------------------*/
#day-trip, #hotel-camp, #lodging{ margin-top: 150px;}
    
/*-----------------------------
squareImgBox
-----------------------------*/
.squareImgBox{ padding: 100px 0; background: #fafafa; margin-bottom: 100px;}
.squareImgBox h3{ margin: 0 auto 40px; width: 650px;}
.squareImgBox .lead{
	text-align: center;
	font-size: 30px;
	font-family: "Noto Serif JP", serif;
	margin-bottom: 60px;
	}
.wrapPhotoList{ width: 810px; margin: 0 auto; position: relative;}
.photoList{ display: flex; flex-wrap: wrap; overflow: hidden; /*max-height: 440px;*/ transition: max-height 0.7s, padding 0.7s;}
.photoList.active{ max-height: 700px; padding-bottom: 80px;}
.photoList li{ width: 250px; height: 250px; margin: 25px 25px 0 0; position: relative; text-align: center;}
.photoList li:nth-child(-n+3){ margin-top: 0;}
.photoList li:nth-child(3n){ margin-right: 0;}
.photoList li a{ display: block; width: 100%; height: 100%; overflow: hidden;}
.photoList li a .img{ background: #ccc; height: 100%; width: 100%; position: relative;}
.photoList li a .text{ background: rgba(255, 255, 255, 0.7); display: flex; flex-direction: column; align-items: center; justify-content: center; color: #00495c; font-size: 18px; opacity: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: translateY(30px); transition: transform 0.5s, opacity 0.5s;}
.photoList li a:hover .text{ opacity: 1; transform: translateY(0);}
.photoListBtn{ width: 100%; padding: 10px 0; text-align: center; font-size: 18px; position: absolute; bottom: 0; cursor: pointer; background: url("../images/events/bg-img-links.png") repeat-x center center; background-size: auto 100%; font-weight: bold; color: #008899;}
.photoListBtn span{ display: inline-block; position: relative; padding-right: 30px;}
.photoListBtn span::after{ content: ""; display: block; height: 14px; width: 14px; border-top: 2px solid #008899; border-right: 2px solid #008899; transform: rotate(135deg); position: absolute; right: 0; top: calc(50% - 11px); transition: all 0.7s;}
.photoListBtn.active span::after{ content: ""; transform: rotate(-45deg); top: calc(50% - 5px);}
    
.goods-shop-list .wrapper-container .area-item-desc-wrapper .details-list .details-list-item .details-list-item-label{ line-height: 1.2;}
    
    
/*-----------------------------
bnr-area
-----------------------------*/
ul.bnr-area{ width: 800px; list-style: none; margin: 50px auto 120px; }
ul.bnr-area li{ margin-bottom: 50px;}
ul.bnr-area li:last-child{ margin-bottom: 0;}
ul.bnr-area li a{ transition: all 0.7s;}
ul.bnr-area li img{ width: 100%;}
ul.bnr-area li a:hover{ opacity: 0.7;}
    
    
.mt60{ margin-top: 60px;}
ul.detail-list{ list-style: none;}
ul.detail-list li.detail-wrap{ margin-bottom: 60px;}
ul.detail-list li.detail-wrap:last-child{ margin-bottom: none !important;}
    
.attention-txt{ font-weight: bold; color: #F73834;}
}

.mb00{ margin-bottom: 0 !important;}


@media screen and (max-width: 749px){
br.pc{ display: none;}
img.pc{ display: none;}
    
.mv::after { content: ''; position: absolute; bottom: -10vw; left: 0; width: 100%; height: 22vw; background: url("../images/events/mv-curve.png") no-repeat left top; background-size: 110% 100%;}

.mv.mv-events .events-mv-heading{ bottom: 280px; padding-top: 0; height: auto;}
.mv.mv-events p.mv-date{ bottom: 60px; margin: 0 auto; left: calc(50% - 75px);  width: 150px; text-align: center; }
@media screen and (max-width: 749px) {
	.mv.mv-events .mv-date { 
		bottom: 320px!important;
	}
}
.mv-heading.hellowoods-mv-heading .heading{ margin-bottom: 20px;}
.mv-heading.hellowoods-mv-heading .heading-text { text-align: center;}
	
	.challenge-right.events .heading-text {
		margin-top: 40px;
		font-family: "Noto Serif JP", serif;
		font-size: 20pt;
        margin-left: 14px;
        letter-spacing: 0.1em;
        font-weight: 800;
        font-style: normal;
        background: -webkit-gradient(linear, top left, top right, from(#027cc4), to(#09a045));
        background: linear-gradient(to right, #027cc4 0%, #09a045 50%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
	}
    
.goods-shop-list.events-list .events-list-item.bdr { border-bottom: 1px solid #dfdfdf !important; }
	
.l-section.section-events.eventLead{ padding-bottom: 10%;}
.eventLead .challenge.hellowoods{ max-height: none;}
.bnrBox{ margin: 0 40px 15%; text-align: center; padding-bottom: 0;}
.bnrBox a{ display: block; margin-bottom: 10%; position: relative;}
.bnrBox a .bnr-caution{ display: block; margin-top: 3%; font-size: 12px; text-align: center; color: #333;}
.bnrBox a:last-child{ margin-bottom: 0;}
	
	.bnrBox .banner-text {
		position: absolute;
		font-weight: bold;
		line-height: 100%;
	}
	.bnrBox .banner-text.textFireworks {
		left: 1em;
		bottom: .5em;
		color: #fff;
		font-size: 11px;
	}
	.bnrBox .banner-text.textFireworks .small {
		display: block;
		font-weight: normal;
		font-size: 10px;
	}

	
.hashTagBox{ margin: 0 auto 35px; border: 2px solid #d5d5d5; padding: 5%;}
.hashTagBox h4{ font-size: 14px; font-weight: bold; margin: 0 auto 15px; letter-spacing: 0.10em;}
.hashTagBox h4 span{ background-image: -webkit-gradient(0deg, #c3e8d8 19.44%, #ffffff 19.44%, #ffffff 50%, #c3e8d8 50%, #c3e8d8 69.44%, #ffffff 69.44%, #ffffff 100%); background-image: linear-gradient(0deg, #c3e8d8 19.44%, #ffffff 19.44%, #ffffff 50%, #c3e8d8 50%, #c3e8d8 69.44%, #ffffff 69.44%, #ffffff 100%); background-size: 32.00px 32.00px;}
.hashTagBox .text{ font-size: 12px; font-weight: bold;}
	
.ttlSub{ padding: 5%; background: #f2faf5; text-align: center; font-size: 12px;  font-weight: bold; margin: 0 auto 7%; color: #333;}
.ttlSub span{ font-size: 16px; color: #00a040; display: block;}
	
.ttlSub-blue{ padding: 5%; background: #eef9fc; text-align: center; font-size: 12px;  font-weight: bold; margin: 0 auto 7%; color: #333;}
.ttlSub-blue span{ font-size: 16px; color: #2a95ca; display: block;}
	
.mv-heading.hellowoods-mv-heading .heading-subtext {
    margin: 0 auto;
	position: relative;
	bottom: 0;
	font-size: 30px;
	text-align: center;
}
	
	
	
.button {
    font-size: 11px;
    max-width: 400px;
    width: 100%;
    height: auto;
	padding: 10px;
}  
	
/* スクロールダウン */
/*@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@300;400&display=swap');*/
html {
  /* scroll-behavior: smooth;*/
}
.scroll_down {
  position: relative;
  width: 100%;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: cover;
  top: 30px;
  margin-bottom: 110px;
}
.scroll_down:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 80%;
  background: linear-gradient(180deg, rgba(#000, 0) 0, rgba(#000, .8) 80%, rgba(#000, .8) 100%);
}
.scroll_down a {
  display: inline-block;
  position: absolute;
  right: 0;
  bottom: 30px;
  left: 0;
  z-index: 2;
  width: 11px;
  font-weight: bold;
  padding: 10px 10px 55px;
  color: #000;
  font-size: 10px;
  font-family: 'Josefin Sans', sans-serif;
  line-height: 1;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  writing-mode: vertical-lr;
  transition: .2s;
  overflow: hidden;
  margin: auto;
}
.scroll_down a:before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 65%;
  width: 2px;
  height: 50px;
  background: #ddd;
}
.scroll_down a:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 65%;
  width: 2px;
  height: 50px;
  background: #000;
}
.scroll_down a:hover {
  opacity: .5;
}
#type01 a:after {
  animation: sdl01 1.5s cubic-bezier(1, 0, 0, 1) infinite;
}
@keyframes sdl01 {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  50% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  50.1% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}
    

/*-- 終了対応
----------------------------------------------*/
#secInfo { width: auto; padding: 3% 3% 5%; text-align: center; background: #F5F5F5; font-family: "ヒラギノ角ゴ Pro", "メイリオ", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, "-apple-system", "Helvetica Neue", "Yu Gothic", YuGothic, Verdana, Meiryo, sans-serif;}
#secInfo p { width: 100% !important; text-align: center; font-size: 11px !important; color: #E50012 !important; margin: 0 auto; line-height: 1; height: 42px; padding: 15px 3%; border: #E50012 solid 2px; box-sizing: border-box; background: #FFF;}
    
.otherCaution{ margin-top: 10px; font-size: 12px; line-height: 2; }
.desc-Caution{ margin: 10px 0 35px; font-size: 12px; line-height: 2;}
.mb00{ margin-bottom: 0 !important;}
.point-txt{ font-weight: bold; color: #00a040; margin: 7% 0 2%; font-size: 12px;}
.point-txt::before{ content: "\FF3C"; margin-right: 10px;}
.point-txt::after{ content: "\FF0F"; margin-left: 10px;}
    
/*-----------------------------
mainMap
-----------------------------*/
.mainMap{ width: 100%; }
.mainMap .innerMainMap{ width: 90%; margin: 0 auto; text-align: center;}
.mainMap .innerMainMap h2{ font-size: 26px; color: #008899; margin:  0 auto 7%; font-weight: normal; letter-spacing: 3px;}
.mainMap .innerMainMap .text{ font-size: 16px; margin-bottom: 0; letter-spacing: 3px;}
.mainMap .innerMainMap .map img{ transform: scale(1.7);}
.mainMap .innerMainMap .map-cau{ margin: 5% auto 20%; font-size: 14px; }
.mainMap .innerMainMap .map-cau .map-cau-icon{ margin: 0 10px 0 0; display: inline-block; vertical-align: middle;}
.mainMap .innerMainMap .map-cau .map-cau-icon img{ width: 35px !important; }

.position-map{ margin: 40px auto 40px; position: relative; }
.map-base img{display: block; width: 100%;}
.map-icon00{ width:14.16666666666667%; position: absolute; top: 18.88888888888889%; left: 24.16666666666667%;}
.map-icon01-01{ width: 7.5%; position: absolute; top: 42.22222222222222%; left: 22.5%;}
.map-icon01-02{ width: 7.5%; position: absolute; top: 47.777777777777%; left: 42.5%;}
.map-icon01-03{ width: 7.5%; position: absolute; top: 63.33333333%; left: 59.1666666666666%;}
.map-icon01{ width: 11.5%; position: absolute; top: 30.55555555555556%; left: 52.5%;}
.map-icon02{ width: 11.5%; position: absolute; top: 43.111111111111111%; left: 69.5%;}
.map-icon03{ width: 11.5%; position: absolute; top: 34%; left: 85.5%;}
.map-icon04{ width: 11.5%; position: absolute; top: 6%; left: 48.5%;}
.map-icon-camp{ width: 7.5%; position: absolute; top: 25.5555555555555%; left: 46.666666666666666%;}
.map-icon-food{ width: 7.5%; position: absolute; top: 40%; left: 74.166666666666%;}
.map-icon-park{ width: 7.5%; position: absolute; top: 61.11111111111%; left: 41.666666666666%;}
.map-icon-cool01{ width: 12.5%; height: auto; position: absolute; top: 83.11111111111%; left: 0;}
.map-icon-cool02{ width: 12.5%; height: auto; position: absolute; top: 30.11111111111%;; left: 0;}
.position-map a{ opacity: 1;}
    
/*-----------------------------
subEventList
-----------------------------*/
.subEventList li.subEvent{ width: 100%; box-sizing: border-box; margin: 0 auto 10%;}
.subEventList li.subEvent:last-child{ margin-bottom: 0;}
.subEventList .ttl{ font-size: 13px; font-weight: bold; margin: 0 auto 15px; position: relative; padding-left: calc(1em + 7px);}
.subEventList .ttl::before{ content: "\25A0"; color: #00a040; margin-right: 0; position: absolute; left: 0;}
    

/*-----------------------------
ID margin
-----------------------------*/
#day-trip, #hotel-camp, #lodging{ margin-top: 60px;}    
    
    
/*-----------------------------
squareImgBox
-----------------------------*/
.squareImgBox{ padding: 20% 5%; background: #fafafa; margin-bottom: 100px;}
.squareImgBox h3{ margin: 0 auto 10%; width: 90%;}
.squareImgBox .lead{
	text-align: center;
	font-size: 20px;
	font-family: "Noto Serif JP", serif;
	margin-bottom: 60px;
	}
.wrapPhotoList{ width: 100%; margin: 0 auto; position: relative;}
.photoList{ display: flex; flex-wrap: wrap; overflow: hidden; /*max-height: 100vw;*/ transition: max-height 0.7s, padding 0.7s;}
.photoList.active{ max-height: 200vw; padding-bottom: 80px;}
.photoList li{ width: 32%; margin: 2% 2% 0 0; position: relative; text-align: center;}
.photoList li:nth-child(-n+3){ margin-top: 0;}
.photoList li:nth-child(3n){ margin-right: 0;}
.photoList li a{ display: block; width: 100%; height: 100%; overflow: hidden;}
.photoList li a .img{ background: #ccc; height: 100%; width: 100%; position: relative;}
.photoList li a .text{ background: rgba(255, 255, 255, 0.7); display: flex; flex-direction: column; align-items: center; justify-content: center; color: #00495c; font-size: 12px; opacity: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: translateY(30px); transition: transform 0.5s, opacity 0.5s;}
.photoList li a:hover .text{ opacity: 1; transform: translateY(0);}
.photoListBtn{ width: 100%; padding: 10px 0; text-align: center; font-size: 14px; position: absolute; bottom: -1px; cursor: pointer; background: url("../images/events/bg-img-links.png") repeat-x center center; background-size: auto 100%; font-weight: bold; color: #008899;}
.photoListBtn span{ display: inline-block; position: relative; padding-right: 30px;}
.photoListBtn span::after{ content: ""; display: block; height: 14px; width: 14px; border-top: 2px solid #008899; border-right: 2px solid #008899; transform: rotate(135deg); position: absolute; right: 0; top: calc(50% - 11px); transition: all 0.7s;}
.photoListBtn.active span::after{ content: ""; transform: rotate(-45deg); top: calc(50% - 5px);}

.goods-shop-list .wrapper-container .area-item-desc-wrapper .details-list .details-list-item .details-list-item-label{ line-height: 1.2;}

/*-----------------------------
bnr-area
-----------------------------*/
ul.bnr-area{ width: 80%; list-style: none; margin: 0 auto 20%; }
ul.bnr-area li{ margin-bottom: 7vw;}
ul.bnr-area li:last-child{ margin-bottom: 0;}
ul.bnr-area li a{ transition: all 0.7s;}
ul.bnr-area li img{ width: 100%;}
ul.bnr-area li a:hover{ opacity: 0.7;}

.mt60{ margin-top: 20%;}
ul.detail-list{ list-style: none;}
ul.detail-list li.detail-wrap{ margin-bottom: 20%;}
ul.detail-list li.detail-wrap:last-child{ margin-bottom: none !important;}
    
.attention-txt{ font-weight: bold; color: #F73834;}
    
.mb00{ margin-bottom: 0 !important;}
}


    .athleticBox .text {
        margin-bottom: 60px;
    }

.athleticSubTitle {
	text-align: center;
	font-size: 26px;
	margin-bottom: 40px;
	font-family: "Noto Serif JP", serif;
}

.athleticSubTitle span {
	display: inline-block;
	background: linear-gradient(transparent 70%, #c3e8d8 30%);  
}

@media screen and (max-width: 749px) {
	.athleticSubTitle {
		font-size: 16px;
	}

	.athleticSubTitle span {
		display: inline;
	}
}

@media screen and (max-width: 749px) {
    .athleticBox .text img {
        display: block;
        height: auto;
        margin: 0 auto;
        width: 100%;
    }
}

@media screen and (min-width: 750px) {
    .athleticBox .text img {
        display: block;
        height: auto;
        margin: 0 auto;
    }
}



@media screen and (max-width: 749px) {
    .pickupLinkList {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        margin: 0 auto 15%;
        width: 90%;
    }
}

@media screen and (min-width: 750px) {
    .pickupLinkList {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        margin: 0 auto 140px;
    }
}

@media screen and (max-width: 749px) {
    .pickupLinkList li {
        width: 48%;
    }
}
@media screen and (min-width: 750px) {
    .pickupLinkList li {
        width: 300px;
    }
}
@media screen and (max-width: 749px) {
    .pickupLinkList li a {
        display: block;
        transition: opacity 0.8s;
    }
}

@media screen and (max-width: 749px) {
    .pickupLinkList li a img {
        width: 100%;
        height: auto;
    }
}
@media screen and (max-width: 749px) {
    .subAthleticBox {
        margin: 0 auto 7%;
        width: 90%;
    }
}

@media screen and (min-width: 750px) {
    .subAthleticBox {
        margin: 0 auto 100px;
        width: 1020px;
    }
}

@media screen and (max-width: 749px) {
    .subAthleticBox .text img {
        display: block;
        height: auto;
        margin: 0 auto;
    }
}

@media screen and (max-width: 749px) {
    .subAthleticBox img.sp {
        display: block !important;
    }
}

@media screen and (max-width: 749px) {
    .subAthleticBox img.pc {
        display: none !important;
    }
}

@media screen and (max-width: 749px) {
    .subAthleticBox .subAthleticList {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
    }
}

@media screen and (min-width: 750px) {
    .subAthleticBox .subAthleticList {
        width: 100%;
        display: flex;
    }
}

@media screen and (min-width: 750px) {
    .subAthleticBox .subAthleticList li {
        width: 50%;
    }
}

@media screen and (max-width: 749px) {
    .subAthleticBox .subAthleticList li {
        width: 50%;
    }
}

@media screen and (max-width: 749px) {
    .subAthleticBox .subAthleticList li:not(:last-child) {
        margin-bottom: 10%;
    }
}

@media screen and (max-width: 749px) {
    .subAthleticBox img.pc {
        display: none !important;
    }
}

@media screen and (max-width: 749px) {
    .subAthleticBox .subAthleticList li a img {
        width: 100%;
        height: auto;
        display: block;
    }
}

#footer { margin: 30px auto; overflow: hidden; width: 980px; font-family: "ヒラギノ角ゴ Pro", "メイリオ", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, "-apple-system", "Helvetica Neue", "Yu Gothic", YuGothic, Verdana, Meiryo, sans-serif;}




#footer { overflow: hidden;padding-bottom: 30px; margin: 20px auto 10px auto; width: 94%; background: #ffffff;}
/* #footer p.note { font-size: 12px; text-align: left; float: left; line-height: 150%;} */

#footer p.note {
	font-size: 12px;
    text-align: left;
    float: left;
    color: #000;
    width: 96% !important;
    max-width: 96% !important;
	line-height: 140%;
}

#footer.footer-notes {
	margin-bottom: 50px;
}

@media screen and (min-width: 750px){
	#footer { margin: 30px auto; overflow: hidden; width: 980px;}


	#footer p.note { font-size: 12px; float: left; text-align: center; line-height: 150%;}

	#footer.footer-notes {
		margin-bottom: 50px;
		margin-bottom: 80px;
	}
}

.subpage {
	margin-bottom: 0;
}

.buttonText001 {
	display: block;
	background-image: url("../images/events/icon-arrow-001.png"), linear-gradient(to right, #75b8e0 0%, #1959a8 100%);
	background-repeat: no-repeat;
	background-position: right 30px center, center center;
	background-size: 43px auto, auto auto;
	color: #fff;
	padding: 2.3em 1em;
	font-size: 30px;
	font-weight: bold;
	position: relative;
}

.buttonText001__icon001 {
	position: absolute;
	left: 10px;
	top: 30px;
	width: 170px;
	 transform: rotate(-20deg);
}

@media screen and (max-width: 749px) {
	.buttonText001 {
		font-size: 14px;
		background-size: 7% auto, auto auto;
		background-position: right 10px center, center center;
		padding: 2.9em .5em;
	}
	.buttonText001__icon001 {
		width: 50px;
		top: 10px;
		left: 5px;
	}
}

.buttonText002 {
	display: block;
	background-image: url("../images/events/icon-arrow-001.png");
	background-color: #68b4ad;
	background-repeat: no-repeat;
	background-position: right 30px center;
	background-size: 43px auto;
	color: #fff;
	padding: 2.3em 1em;
	font-size: 30px;
	font-weight: bold;
	position: relative;
}

.buttonText002__icon001 {
	position: absolute;
	left: 30px;
	top: 45px;
	width: 90px;
}

@media screen and (max-width: 749px) {
	.buttonText002 {
		font-size: 14px;
		background-size: 7% auto, auto auto;
		background-position: right 10px center, center center;
		padding: 2em .5em;
	}
	.buttonText002__icon001 {
		width: 30px;
		top: 32px;
		left: 20px;
	}
}

a.banner-present {
	position: relative;
	display: block;
}

.banner-present-text001,
.banner-present-text002,
.banner-present-text003,
.banner-present-text004 {
	position: absolute;
	font-weight: bold;
}

.banner-present-text001 {
	text-align: left;
	padding: .2em .5em;
	font-size: 24px;
    top: 30px;
    left: 330px;
	transform: rotate(-10deg);
}

.banner-present-text001 span {
	display: inline-block;
	background: #5fc0d0;
	color: #fff;
	padding: .2em .5em;
	margin-bottom: 4px;
}

.banner-present-text002 {
	color: #0292ac;
	top: 1em;
	right: 10px;
	text-align: center;
	width: 540px;
	font-size: 30px;
}

.banner-present-text003 {
	color: #0292ac;
	top: 1.9em;
	right: 10px;
	text-align: center;
	width: 540px;
	font-size: 35px;
}

.banner-present-text003 span {
	background:linear-gradient(transparent 60%, #ff6 60%);
	font-size: 40px;
}

.banner-present-text004 {
	color: #0292ac;
	top: 2.4em;
	right: 10px;
	text-align: center;
	width: 540px;
	font-size: 50px;
}

@media screen and (max-width: 749px) {
	.banner-present-text001 {
		font-size: 2.4vw;
        left: initial;
        right: 47%;
        top: 1em;
	}
	.banner-present-text002,
	.banner-present-text003,
	.banner-present-text004 {
		width: 50%;	
	}
	.banner-present-text002 {
		font-size: 2.7vw;
	}
	.banner-present-text003 {
		font-size: 3vw;
		top: 2em;
	}
	.banner-present-text003 span {
		font-size: 3.4vw;
	}
	.banner-present-text004 {
		font-size: 3.4vw;
		top: 3.2em;
	}
	
}

.u-sp:not(:root) {
	display: none;
}

.u-pc:not(:root) {
	display: inline-block;
}

@media screen and (max-width: 749px) {
	.u-sp:not(:root) {
	display: inline-block;
	}

	.u-pc:not(:root) {
		display: none;
	}
}

.otherCaution{ margin-top: 10px; font-size: 14px; line-height: 2;}

@media screen and (max-width: 749px) {
	.otherCaution { margin-top: 10px; font-size: 12px; line-height: 2;}
}


.goods-shop-list .goods-shop-items.itemPickup,
.itemPickup {
	background: #e1f6f4;
	padding-top: 0;
	border-bottom: 0;
	margin-bottom: 40px;
}

.itemPickup .wrapper-container .area-item-desc-wrapper {
	padding-left: 2em;
	padding-right: 2em;
	float: none;
	width: 100%;
	max-width: initial;
}

.goods-shop-list .goods-shop-items.itemPickup .subpage-image-gallery img {
	width: 100%;
}

.goods-shop-list.events-list .itemPickup.events-list-item .subpage-title {
	font-size: 30px;
}

.itemPickup .title {
	text-align: center;
}

.itemPickup .subpage-title {
	text-align: center;
	font-size: 20px;
}
.itemPickup .carbike-article-list.details-list {
	background: #fff;
	width: 600px;
	margin-left: auto;
	margin-right: auto;
}

.itemPickup .carbike-article-list-label {
	background: #68b4ad;
	color: #fff;
}

@media screen and (max-width: 749px) {
	.goods-shop-list .goods-shop-items.itemPickup,
	.itemPickup {
		margin: 0 calc(50% - 50vw);
		width: 100vw;
		padding-top: 0;
		margin-bottom: 40px;
	}
	
	.goods-shop-list.events-list .itemPickup.events-list-item .subpage-title {
		font-size: 22px;
	}

	.itemPickup .wrapper-container .area-item-desc-wrapper {
		padding-left: 2em;
		padding-right: 2em;
		float: none;
	}
	
	.itemPickup .carbike-article-list.details-list {
		background: #fff;
		width: 90%;
		margin-left: auto;
		margin-right: auto;
	}

	.itemPickup .title {
		text-align: center;
	}

	.itemPickup .subpage-title {
		text-align: center;
		font-size: 20px;
	}
}

.goods-shop-list.events-list .events-list-item.blank-border-top {
	border-top: 1px solid #dfdfdf;
	margin-top: 40px;
	padding-top: 40px;
}

/* 追加 */
.goods-shop-list .itemPickup .wrapper-container .area-item-image-wrapper {
	width: 100%;
	max-width: 100%;
	
}
@media screen and (max-width: 749px) {
.goods-shop-list .itemPickup .wrapper-container .area-item-image-wrapper{
	width: 100%;
	max-width: 100%;
}
}

.itemPickup .swiper-container {
	background: none;
}

.items.itemPickup .swiper-container,
.items.itemPickup .swiper-container {
	background: #e1f6f4;
}

.goods-shop-list.events-list .events-list-item.itemPickup .button {
	margin-left: auto;
	margin-right: auto;
}



/*-- ページ上部のアンカーボタン PC
----------------------------------------------*/
ul.btn-list {
  list-style: none;
  margin: 0 auto 40px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  color: #333;
  font-weight: bold;
}
ul.btn-list li {
  width: auto;
  font-size: 19px !important;
  position: relative;
  text-align: center;
  margin-left: 2em;
  margin-right: 2em;
  margin-bottom: 3em;
  display: flex;
}
ul.btn-list li a {
  position: relative;
  transition: all 0.6s;
  color: #333;
  /*background-image: -webkit-gradient(0deg, #c6daed 19.44%, #ffffff 19.44%, #ffffff 50%, #c6daed 50%, #c6daed 69.44%, #ffffff 69.44%, #ffffff 100%);
  background-image: linear-gradient(0deg, #c6daed 19.44%, #ffffff 19.44%, #ffffff 56%, #c6daed 50%, #c6daed 69.44%, #ffffff 69.44%, #ffffff 100%);
  background-size: 36.00px 72.00px;*/
	background: linear-gradient(transparent 70%, #c6daed 30%);
  margin: 0 auto 50px;
  padding: 0 10px 0 10px;
  display: inline-block;
  min-width: 12em;
}
ul.btn-list li a::after {
  position: absolute;
  top: 45px;
  left: 0;
  right: 0;
  content: '';
  display: block;
  width: 30px;
  height: 34px;
  background-image: url(../images/opened.png);
  background-size: contain;
  margin: auto;
}
ul.btn-list li a:hover {
  opacity: 0.7;
}
ul.btn-list li a span.tab_date {
  font-size: 16px;
  display: block;
  color: #00a040;
	position: absolute;
	bottom: -30px;
	left: 0;
	right: 0;
	margin: auto;
}

@media screen and (max-width: 749px) {
  /*-- ページ上部のアンカーボタン SP
----------------------------------------------*/
  ul.btn-list {
    list-style: none;
    margin: 0 auto 10%;
    display: flex;
    justify-content: center;
    flex-flow: wrap;
    color: #333;
    font-weight: bold;
  }
  ul.btn-list li {
    width: 45%;
    margin: 5% 1% 0 1%;
    position: relative;
    font-size: 3.7vw !important;
    text-align: center;
  }
  ul.btn-list li a {
    transition: all 0.6s;
    color: #333;
    /*background-image: -webkit-gradient(0deg, #c6daed 19.44%, #ffffff 19.44%, #ffffff 50%, #c6daed 50%, #c6daed 69.44%, #ffffff 69.44%, #ffffff 100%);
    background-image: linear-gradient(0deg, #c6daed 19.44%, #ffffff 19.44%, #ffffff 50%, #c6daed 50%, #c6daed 69.44%, #ffffff 69.44%, #ffffff 100%);
    background-size: 32.00px 32.00px;*/
	  background: linear-gradient(transparent 85%, #c6daed 15%);
  margin: 0 auto 50px;
  padding: 0 10px 0 10px;
    min-width: initial;
	  min-height: 2.6em;
    position: relative;
    width: 100%;
	  display: flex;
	  justify-content: space-around;
	  align-items: center;
  }
  ul.btn-list li a::after {}
  ul.btn-list li a:hover {
    opacity: 0.7;
  }
  /*	ul.btn-list li:nth-of-type(1),
	ul.btn-list li:nth-of-type(2){
		padding-top: 1em;
	}
	*/
  ul.btn-list li a span.tab_date {
    display: block;
    text-align: center;
    font-size: 12px;
    position: absolute;
    bottom: 0;
    top: 50px;
    margin: auto;
    left: 0;
    right: 0;
  }
}

.notes001 {
	text-align: center;
}

.notes001 p {
	display: inline-block;
	margin-bottom: 2em;
	background: #e3fbff;
	font-weight: 600;
	text-align: center;
	line-height: 200%;	
	box-shadow: 0px 0px 0px 5px #e3fbff;
  border: dashed 3px #c7ecf3;
    padding: 10px 20px;
}
@media screen and (max-width: 749px) {
	.notes001 p {
		font-size: 12px;
	}
}

/* ページトップへリンク */
#page-top {
    width: 50px;
    height: 50px;
    display: none;
    position: fixed;
    right: 30px;
    bottom: 50px;
    z-index: 200;
}
#page-top p {
    margin: 0;
    padding: 0;
}

#move-page-top {
    text-decoration: none;
    display: block;
    cursor: pointer;
}

#page-top p img {
    width: 50px;
    opacity: 0.8;
    filter: alpha(opacity=80);
}

@media screen and (max-width: 749px) {
	#page-top {
        width: 40px;
        height: 40px;
        display: none;
        position: fixed;
        right: 3%;
        bottom: 5%;
        z-index: 200;
    }
	    #page-top p img {
        width: 100%;
        opacity: 0.8;
        filter: alpha(opacity=80);
    }
}

/* 追加*/
@media screen and (max-width: 749px) {
  br.pc {
    display: none;
  }
  img.pc {
    display: none;
  }
  span.pc {
    display: none;
  }
  a.pc {
    display: none;
  }

  .mv {
    height: 570px;
  }
  .mv-image {
    background-position: center center;
    height: 570px;
  }
  .mv.mv-events {
    position: relative;
  }

}

/* -------------------------------------------------------
 utilities
------------------------------------------------------- */
.u-mt0:not(:root) { margin-top: 0; }
.u-mt10:not(:root) { margin-top: 10px; }
.u-mt20:not(:root) { margin-top: 20px; }
.u-mt30:not(:root) { margin-top: 30px; }
.u-mt40:not(:root) { margin-top: 40px; }
.u-mt50:not(:root) { margin-top: 50px; }
.u-mt60:not(:root) { margin-top: 60px; }
.u-mt70:not(:root) { margin-top: 70px; }
.u-mt80:not(:root) { margin-top: 80px; }
.u-mt90:not(:root) { margin-top: 90px; }
.u-mt100:not(:root) { margin-top: 100px; }

.u-mtM10:not(:root) { margin-top: -10px; }
.u-mtM20:not(:root) { margin-top: -20px; }
.u-mtM30:not(:root) { margin-top: -30px; }
.u-mtM40:not(:root) { margin-top: -40px; }
.u-mtM50:not(:root) { margin-top: -50px; }
.u-mtM60:not(:root) { margin-top: -60px; }
.u-mtM70:not(:root) { margin-top: -70px; }
.u-mtM80:not(:root) { margin-top: -80px; }
.u-mtM90:not(:root) { margin-top: -90px; }
.u-mtM100:not(:root) { margin-top: -100px; }

.u-mb0:not(:root) { margin-bottom: 0; }
.u-mb10:not(:root) { margin-bottom: 10px; }
.u-mb20:not(:root) { margin-bottom: 20px; }
.u-mb30:not(:root) { margin-bottom: 30px; }
.u-mb40:not(:root) { margin-bottom: 40px; }
.u-mb50:not(:root) { margin-bottom: 50px; }
.u-mb60:not(:root) { margin-bottom: 60px; }
.u-mb70:not(:root) { margin-bottom: 70px; }
.u-mb80:not(:root) { margin-bottom: 80px; }
.u-mb90:not(:root) { margin-bottom: 90px; }
.u-mb100:not(:root) { margin-bottom: 100px; }

.u-mbM10:not(:root) { margin-bottom: -10px; }
.u-mbM20:not(:root) { margin-bottom: -20px; }
.u-mbM30:not(:root) { margin-bottom: -30px; }
.u-mbM40:not(:root) { margin-bottom: -40px; }
.u-mbM50:not(:root) { margin-bottom: -50px; }
.u-mbM60:not(:root) { margin-bottom: -60px; }
.u-mbM70:not(:root) { margin-bottom: -70px; }
.u-mbM80:not(:root) { margin-bottom: -80px; }
.u-mbM90:not(:root) { margin-bottom: -90px; }
.u-mbM100:not(:root) { margin-bottom: -100px; }

.u-ml0:not(:root) { margin-left: 0; }
.u-ml10:not(:root) { margin-left: 10px; }
.u-ml20:not(:root) { margin-left: 20px; }
.u-ml30:not(:root) { margin-left: 30px; }
.u-ml40:not(:root) { margin-left: 40px; }
.u-ml50:not(:root) { margin-left: 50px; }
.u-ml60:not(:root) { margin-left: 60px; }
.u-ml70:not(:root) { margin-left: 70px; }
.u-ml80:not(:root) { margin-left: 80px; }
.u-ml90:not(:root) { margin-left: 90px; }
.u-ml100:not(:root) { margin-left: 100px; }

.u-mr0:not(:root) { margin-right: 0; }
.u-mr10:not(:root) { margin-right: 10px; }
.u-mr20:not(:root) { margin-right: 20px; }
.u-mr30:not(:root) { margin-right: 30px; }
.u-mr40:not(:root) { margin-right: 40px; }
.u-mr50:not(:root) { margin-right: 50px; }
.u-mr60:not(:root) { margin-right: 60px; }
.u-mr70:not(:root) { margin-right: 70px; }
.u-mr80:not(:root) { margin-right: 80px; }
.u-mr90:not(:root) { margin-right: 90px; }
.u-mr100:not(:root) { margin-right: 100px; }

.u-alLeft:not(:root) { text-align: left; }
.u-alRight:not(:root) { text-align: right; }
.u-alCenter:not(:root) { text-align: center; }
.u-blockCenter:not(:root),
.goods-shop-list.events-list .events-list-item .button.u-blockCenter{ margin-left: auto; margin-right: auto;}