@charset "UTF-8";
/* CSS Document */

 

p,h1,h2,h3,h4,h5,h6{
	margin-top: 0;
}

img{
	
	vertical-align: bottom;
}

a {
    text-decoration:none; 
}

ul {
	margin:0;
	padding: 0;
}


body{
	background-color: #fff;
}




h3 {
	position: relative;
	text-align: center;
	margin: 30px 0px 25px 0px;
	font-size: 10px;
	color: #ffffff;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
font-style: normal;
}

h4{
	position: relative;
	text-align: center;
	margin: 20px 0px 50px 0px;
	font-size: 8px;
	color: #000;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
font-style: normal;
	
}

h5 {
	position: relative;
	text-align: center;
	color: #000000;
	margin: 20px 0px 20px 0px;
	font-size: 22px;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 700;
	font-style: normal;
}



.title{
	position: absolute;
	display: block;
	text-align: center;
	top:6%;
	left: 0;
 	right: 0;
    margin: auto;
	width: 60vw;
	max-width: 550px;	
	
}

.title img{
	width: 100%;
}

.titleimage{
	position: relative;
	display: block;
	text-align: center;
	top:0%;
	left: 0;
 	right: 0;
    margin: auto;
	width: 100vw;
	max-width: 750px;	
	
}

.titleimage img{
	width: 100%;
}





.maintext{
	position: relative;
	display: block;
	text-align: justify;
	font-size: 14px;
	margin-top: 20px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 50px;
	padding-left: 5%;
	padding-right: 5%;
	left: 0;
	right: 0;
	letter-spacing: 0.02em;
	line-height:200%;
 	color: #000000;
	text-decoration: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 500;
	max-width: 700px;
	}



.js-animation {
  opacity: 0;
  visibility: hidden;
  transform: translateY(40px);
  transition: all 1s;
  max-width: 1080px; /* 最大幅 */
}
.js-animation.is-show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0px);
}


.js-animation img { 
	width: 100%;
}







.creditbox{
	padding-top: 10px;
	margin-bottom: 30px;
	margin-left: auto;
	margin-right: auto;
	width: 90vw;
	max-width: 600px;
}


.credit{
	margin: 0 auto;
	text-align: center;
	font-size: 13px;
	letter-spacing: 0em;
	line-height:2.5em;
	color: #ffd35c;
	text-decoration: none;
	font-family: jaf-bernina-sans, sans-serif;
font-weight: 600;
font-style: normal;
	
}

.credit a{
	color: #ffd35c;
}

.credit p{
	color: #ffd35c;
}

span {
	display: inline-block;
	line-height:.8em;
	border-bottom: solid 1.5px #ffd35c;
}

span2 {
	
}

span3 {
}





.bottomlink{
	display: flex;
	display: -webkit-flex;
	top:0;
	right: 0;
	width: 100%;
	margin-right:0px;
	margin-top: 0px;
}

.pretext{
	display: inline-block;
	text-align: center;
	font-size: 20px;
	letter-spacing: 0.1em;
	line-height:1em;
	color: #ffffff;
	text-decoration: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 600;
	margin: 22px auto;
	border-bottom: solid 2px #ffffff;
	}

.pretext a{
	text-decoration: none;
}





.moviestyle{
	margin: 0 auto;
	padding-bottom: 120px;
	width: 90vw;
	max-width: 700px;
}



/* ハロサン用追加 */



.photo01{
	width: 100%;
	max-width: 600px;
	margin: -30px auto 0px;	
}

.photo01 img{
	width: 100%
}

.title01{
	width: 100%;
	max-width: 600px;
	margin: 110px auto 0px;	
}

.title01 img{
	width: 100%
}

.sex01{
	width: 100%;
	max-width: 600px;
	margin: 30px auto 30px;	
}

.sex01 img{
	width: 100%
}


.maintitle01{
	width: 100%;
	max-width: 600px;
	margin: 35px auto 40px;	
}

.maintitle01 img{
	width: 100%
}


.fade-img-box {
 width: 90%;
 height: 600px;
 margin: 0 auto;
 position:relative;
}

.fade-img-box img {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 object-fit:cover;
}


.fade-img-box02 {
 width: 90%;
 height: 600px;
 margin: 0 auto;
 position:relative;
}

.fade-img-box02 img {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 object-fit:cover;
}

.fade-img-box03 {
 width: 90%;
 height: 600px;
 margin: 0 auto;
 position:relative;
}

.fade-img-box03 img {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 object-fit:cover;
}





.layout{
		position: absolute;
		top:30px;
		display: flex;
   		flex-wrap: wrap;
		text-align: center;
		margin: 0 auto;
		max-width: 750px;
}

.layout02{
		position: absolute;
		top:95px;
		left: 0;
		right: 0;
		text-align: center;
		margin: 0 auto;
		max-width: 750px;
}

.itemall{
	width: 100vw;
	margin-top: 10px;
	margin-bottom: 20px;
}

.parent_box {
  width: 100vw;
  max-width: 750px;
  display: flex;
	margin: 20px auto;
}

.side_image{
	width: 30vw;
}

.side_image img{
	width: 100%;
}

.side_text_box{
	width: 70vw;
}


.note{
	position: relative;
	width: 100vw;
	height: auto;
	max-width: 600px;
	margin: 10px auto 0px;	
	padding-bottom: 250px;
}

.pr{
	position: relative;
	width: 100vw;
	height: 520px;
	max-width: 600px;
	margin: 0px auto 0px;	
	padding-bottom: 0px;
}

.prcopy{
	position: absolute;
	left: 0;
	right: 0;
	top:0;
	width: 100%;
	max-width: 600px;
	margin: 0 auto;	
}

.prcopy img{
	width: 100%
}

.hello{
	position: absolute;
	right: 40px;
	top:370px;
	width: 200px;
}

.hello img{
	width: 100%
}


.sweatbase{
	position: relative;
	width: 100vw;
	height: 500px;
	max-width: 600px;
	margin: 50px auto 0px;	
	padding-bottom: 0px;
}

.sweat{
	position: absolute;
	top:0;
	left:0;
	right: 0;
	width: 100%;
	max-width: 600px;
	margin: 0 auto;	
}

.sweat img{
	width: 100%
}

.sweaticon{
	position: absolute;
	top:50px;
	right: 20px;
	width: 130px;
	margin: 0 auto;	
	animation: fluffy1 3s ease infinite;
}

@keyframes fluffy1 {
  0% { transform:translateX(0) }
  5% { transform:translateX(0) }
  10% { transform:translateX(0) }
  20% { transform:translateX(-15px) }
  25% { transform:translateX(0) }
  30% { transform:translateX(-15px) }
  50% { transform:translateX(0) }
  100% { transform:translateX(0) }
}



.bgcolor01{
	position: relative;
    top: 0;
    left: 50%;
    display: block;
    width: 100vw;
    height: 1980px;
    background: #91B6B5;
    margin-left: -50vw;
	z-index: 1;
}


.contents{
	display: flex;
	width: 600px;
	padding-left:700px;
	margin: 0 auto;
}


.contents_box{
	position: absolute;
	display:block;
	width: 100%;
	max-width: 600px;
	background-color: #ee7361;
	margin: 0 auto;
}


.PClight{
	position: fixed;
	display: none;
	text-align: center;
	top:100px;
 	left: 50px;
	width: 600px;
	z-index: 200;	
}


.PClight img{
	width: 100%;
}


.mordalicon{
	position: fixed;
	display: block;
	text-align: center;
	top:30px;
 	left:8%;
	width: 120px;
	z-index: 200;
    animation:6s linear infinite rotation;
}

@keyframes rotation{
  0%{ transform:rotate(0);}
  100%{ transform:rotate(360deg); }
}

.mordalicon img{
	width: 100%;
}

.overflow{
	overflow:hidden;	
	}


/* ホリディ追加*/


@keyframes zoomUp {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.15);
  }
}

.swiper-slide-active .slide-img,
.swiper-slide-duplicate-active .slide-img,
.swiper-slide-prev
.slide-img{
  animation: zoomUp 10s linear 0s 1 normal both;  
}

.slide-img img{
  position: static;
  height: 65vh; /* 全画面表示 */
  max-width: 600px;
  object-fit: cover;
}

.top-box {
    position: relative;
	max-width: 600px;
	height: 65vh;
}


.kao_icon{
	 width: 100%;
	 display: flex;
	gap: 10% 2%;
	list-style-type:none;
}

.kao_icon02{
	 width: 100%;
	 display: flex;
	gap: 10% 10%;
	list-style-type:none;
}


.sns_kojin{
	 width: 100%;
	 display: flex;
	gap: 0% 0%;
	list-style-type:none;
}


#kozaru{	
}

#maika{	
}

#hassy{	
}


.readtext{
	position:absolute;
    display: block;
    text-align: left;
	font-size: 12px;
	color: #fff;
	text-decoration: none;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-weight: 600;
	font-style: normal;
  letter-spacing:0.05em;
  line-height: 2em;
  bottom:8vh;
  left: 10%;
  z-index: 28;
	white-space: nowrap;
}

.kaolist{
	display: block;
	width:  98%;
	margin: 0 auto 20px;
}

.kaolist02{
	width:  90%;
	margin: 0 auto 10px;
}

.snslist{
	width:  100%;
	margin: 0 auto;
}


.subtext{
	text-align: justify;
	font-size: 12px;
	margin-top: 10px;
	margin-bottom: 20px;
	padding-left: 5%;
	padding-right: 5%;
	line-height:200%;
 	color: #ffd35c;
	text-decoration: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 500;
	font-style: normal;
	letter-spacing: -0.05em;
	}

.subtext02{
	text-align: center;
	font-size: 18px;
	margin-top: 25px;
	margin-bottom: 10px;
	padding-left: 5%;
	padding-right: 5%;
	line-height:200%;
 	color: #fff;
	text-decoration: none;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-weight: 600;
	font-style: normal;
	letter-spacing: -0.05em;
	}


.snsbox{
	margin-top: 50px;
	margin-bottom: 50px;
}


.sns{
	text-align: center;
	font-size: 1.2em;
	letter-spacing: 0.1em;
	line-height:2.2em;
	padding-left: 5%;
	padding-bottom: 0px;
	text-decoration: none;
 	color: #fff;
	font-family: jaf-bernina-sans, sans-serif;
	font-weight: 600;
	font-style: normal;
	}

.logo{
	width: 90vw;
	max-width: 300px;
	margin: 0 auto 50px;
}


.pcsidetext{
	margin: 0 auto;
	text-align: center;
	font-size: 40px;
	letter-spacing: 0em;
	line-height:2.5em;
	color: #ee7361;
	text-decoration: none;
	font-family: jaf-bernina-sans, sans-serif;
font-weight: 600;
font-style: normal;
	padding-bottom: 30px;
	
}

.credit a{
	color: #ffd35c;
}

.credit p{
	color: #ffd35c;
}




/* SP */ 


@media screen and ( max-width : 750px ){


	
.contents{
	display: flex;
	width: 94%;
	padding-left:3%;
	padding-right:3%;
}


.contents_box{
	position: absolute;
	width: 94%;
	display:block;	
}

	
}








/* PC */

@media screen and ( min-width : 750px ){


.fade-img-box {
 height: 500px;
}
	
.itemall{
	width: 600px;
	margin-top: 30px;
	margin-bottom: 20px;
}
	
.sweatbase{
	height: 700px;
}
	
.contents_box{
}
	
	
.slide-img img{
  height: 100vh; /* 全画面表示 */
}

.top-box {
    position: relative;
	height: 100vh;
}
	
	
.mordalicon{
	position: fixed;
	display: block;
	text-align: center;
	top:30px;
 	left:750px;
	width: 120px;
	z-index: 200;
    animation:6s linear infinite rotation;
}

	
body{
	background-color: #ffd35c;
}
	
.PClight{
	display: block;
}
	
.kaolist{
	display: none;
	}
	
.contents{
	margin: 0;
}

	
}