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

 

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}

body {
  line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
  display:block;
}

nav ul {
  list-style:none;
}

blockquote, q {
  quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content:'';
  content:none;
}

a {
  margin:0;
  padding:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}

/* change colours to suit your needs */
ins {
  background-color:#ff9;
  color:#000;
  text-decoration:none;
}

/* change colours to suit your needs */
mark {
  background-color:#ff9;
  color:#000; 
  font-style:italic;
   font-weight:bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom:1px dotted;
  cursor:help;
}

table {
  border-collapse:collapse;
  border-spacing:0;
}

/* change border colour to suit your needs */
hr {
  display:block;
  height:1px;
  border:0;   
  border-top:1px solid #cccccc;
  margin:1em 0;
  padding:0;
}

input, select {
  vertical-align:middle;
}



body{
background-image: url("../images/FC_official_02_bgptn.jpg");
background-repeat:repeat;
}



.mainimage img { 
	width: 100%;
}



.colortext{
	font-size: 20pt;
	padding-left: 10%;
 	color: #000000;
	text-decoration: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 500;
	}



h2 {
	position: relative;
	text-align: center;
	line-height:200%;
	font-size: 11px;
	font-family: jaf-bernina-sans, sans-serif;
font-weight: 400;
font-style: normal;
letter-spacing:0.1em;
}

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

h4{
	position: relative;
	text-align: center;
	margin: 30px 0px 100px 0px;
	font-size: 12px;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
font-style: normal;
	
}




.maintext{
	text-align: center;
	font-size: 1.3em;
	padding-left: 5%;
	padding-right: 5%;
	line-height:200%;
 	color: #000000;
	text-decoration: none;
	font-family: 'Zen Old Mincho', serif;
	font-style: 400;
	}







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


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

.creditbox{
	margin-top: 50px;
	padding-top: 5px;
	padding-bottom: 150px;
	
}


.credit{
	font-size: 1.5em;
	letter-spacing: 0.1em;
	line-height:1.5em;
	padding-left: 5%;
	margin-top: -5px;
	padding-bottom: 0px;
	text-decoration: none;
 	color: #000000;
	font-family: jaf-bernina-sans, sans-serif;
	font-weight: 600;
	font-style: normal;
	}




.top-box {
    position: relative;
}




.buy{
    position: fixed;
    bottom: 3%;
    right: 5%;
    z-index: 10000;
}



.simple_square_btn5 {
	display: block;
	position: relative;
	float: right;
	height: 20px;
	width: 200px;
	padding: 1em;
	text-align: center;
	text-decoration: none;
	font-size: 15px;
	letter-spacing: 0.05em;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 500;
	color: #fff;
	background: #1e3a58;
	margin: 0 auto;
	margin-bottom: 100px;
}


.logo {
	width: 40%;
	max-width: 400px;
	text-align: center;
	margin-left: auto;
    margin-right: auto;
}


.slider{
	max-width: 1080px;
	margin-left: auto;
    margin-right: auto;
}

.slick-next{
    right:0!important;
  }
  .slick-next:before{
    background: url("../img/rela_lp_04_sli02.png")!important;
    background-size: contain!important;
  }
  .slick-prev{
    left:0!important;
  }
  .slick-prev:before{
    background: url("../img/rela_lp_04_sli01.png")!important;
    background-size: contain!important;
  }
  .slick-arrow{
    z-index:2!important;
    width:60px!important;
    height:60px!important;
  }
  .slick-arrow:before{
    content:""!important;
    width: 100%!important;
    height: 100%!important;
    position: absolute;
    top: 0;
    left: 0;
    opacity:1!important;
  }






/* FC追加 */

@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: 100vh; /* 全画面表示 */
  object-fit: cover;
}

.sidemenu{
  position:fixed;
  display: block;
  width: 250px;
  height: 100vh;
  top:0;
  left: 0;
  z-index: 30;
  transition: 1s;
  /*デフォルトで非表示にする*/
  opacity: 0;
  visibility: hidden;
	
}

/*このクラスが付与されると表示する*/
.active{
  opacity: 1;
  visibility: visible;
}


.sidemenu_white{
  position:fixed;
  display: block;
  width: 250px;
  height: 100vh;
  top:0;
  left: 0;
  z-index: 30;
  transition: 1s;
  /*デフォルトで非表示にする*/
  opacity: 1;
  visibility: visible;
	
}

/*このクラスが付与されると表示する*/
.active02{
  opacity: 0;
  visibility: hidden;
}





.menulogo{
    width: 200px;
    margin: 20px auto;
}

.insta{
    width: 30px;
    margin-top: 30px;
	margin-right: 0px;
}



.menu{
	width: 200px;
	margin-top: 20px;
	margin-left: 80px;
	font-size: 14pt;
	line-height:200%;
	letter-spacing:1px;
	font-family: 'EB Garamond', serif;
	font-style: 500;
}

.menutext a{
	color: #000;
	text-decoration: none;
}


.menutext_white a{
	color: #fff;
	text-decoration: none;
}




.sidebg{
  position:absolute;
  display: block;
  width: 250px;
  height: 100vh;
  top:0;
  left: 0;
  z-index: 29;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  background: rgba(240, 240, 230, 0.01);
}


.titletext{
  position:absolute;
  display: block;
  text-align: right;
	font-size: 160px;
	color: #fff;
	text-decoration: none;
	font-family: 'expressway', sans-serif;
	font-weight: 300;
	font-style: normal;
  letter-spacing: -0.02em;
  line-height: 0.8em;
  bottom:5vh;
  right: 0px;
  padding-right: 40px;
  z-index: 28;
}


.homelook{
  position:absolute;
  display: block;
  width: 220px;	
  top:5vh;
  right: 0px;
  padding-right: 40px;
  z-index: 28;
}

.seasontext{
  text-align: right;
	font-size: 18px;
	color: #fff;
	text-decoration: none;
	font-family: 'EB Garamond', serif;
	font-style: 500;
  letter-spacing: -0.02em;
  line-height: 1.0em;
	padding-bottom: 20px;
  }

.homelookimg{
	width: 220px;
}

.homeimage{
	width: 220px;
	margin-bottom: 10px;
	filter: grayscale(100%);
	opacity: 0.8;
  transition: all 0.3s ease-in;
}

.homeimage img{
	width: 100%;
	
}

.homeimage:hover {
	filter: grayscale(0%);
	opacity: 1;
}


.contents{
	display: flex;
	width: 100vw;
	height: 100%; 
	margin-bottom: 10px;
}


.contents_box{
	position: relative;
	display:block;
	margin-top: 200px;
	padding-left:300px;
	padding-right:100px;
	width: 100%;
	max-width: 1800px;
}

.contentstitle{
	position: relative;
	display:block;
	margin-bottom: 10px;
	text-align: left;
	letter-spacing: 0.02em;
	color: #000000;
	font-size: 23pt;
	font-family: 'EB Garamond', serif;
	font-style: 500;
	
}

.seasonsp{
	display: none;	
}

.season_box{
	display: flex;
	display: -webkit-flex;
	flex-wrap:wrap;
	webkit-flex-wrap: wrap;   
	width: 100%;
	margin-bottom: 100px;
	gap: 0px 0%;
}

.season_content{
	width: 100%;
}



.news_box{
	 width: 100%;
	 display: flex;
	flex-wrap: wrap;
	gap: 30px 4%;
	list-style-type:none;
	margin-bottom: 30px;

}

.news_box p{
	text-decoration: none;
}

.news_box a{
	text-decoration: none;
}

.news_content{
	width: 48%;
}

.news_image{
	width: 100%;
}

.news_image img{
	width: 100%;
}

.news_text{
}


.days{
	margin-top: 20px;
	margin-bottom: 15px;
	display: inline-block;
	text-align: left;
	font-size: 15px;
	color: #000000;
	text-decoration: none;
	font-family: 'expressway', sans-serif;
	font-weight: 400;
	letter-spacing: 0.05em;
	font-style: normal;
	border-bottom: solid .7px black;
	}

.newstitle{
	margin-bottom: 10px;
	display:block;
	text-align: left;
	font-size: 40px;
	color: #000000;
	text-decoration: none;
	font-family: 'expressway','Noto Sans JP', sans-serif;
	font-weight: 300;
	letter-spacing: 0.05em;
	font-style: normal;
}

.newstext{
	margin-bottom: 10px;
	display:block;
	text-align: left;
	font-size: 16px;
	color: #000000;
	text-decoration: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 500;
	font-style: normal;
	line-height: 1.5em;
	
}

.newstext03{
	margin-bottom: 10px;
	display:block;
	text-align: left;
	font-size: 16px;
	color: #000000;
	 text-decoration:underline;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 500;
	font-style: normal;
	line-height: 1.5em;
	
}

.newstext02{
	margin-bottom: 10px;
	display:block;
	text-align: left;
	font-size: 16px;
	color: #000000;
	text-decoration: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 500;
	font-style: normal;
	line-height: 1.5em;
	
}

.newsmorebox{
	text-align: right;
}

.newsmorebox a{
	text-decoration: none;
	
}

.newsmore{
	margin-top: 20px;
	margin-bottom: 150px;
	justify-content: flex-end;
	text-align: right;
	display: inline-block;
	font-size: 15px;
	color: #000000;
	text-decoration: none;
	font-family: 'expressway', sans-serif;
	font-weight: 400;
	letter-spacing: 0.05em;
	font-style: normal;
	border-bottom: solid .7px black;
	}

.newsmore a{
	text-decoration: none;
	
}



.sex_box{
	display: flex;
	width: 100%;
	margin-bottom: 170px;
	gap: 0px 2%;
}

.sex_box_sp{
	display: none;
	width: 100%;
	margin-bottom: 100px;
	gap: 0px 0%;
}

.sex_image{
	margin: 0 0% 0 0%;
	width: 40%;
	float: left;
}

.sex_image img{
	width: 100%;
}

.sex_image_sp{
	width: 100%;
}


.ranking_box{
	width: 100%;
	margin-bottom: 100px;
}



.ranking_1_6{
	display: flex;
	display: -webkit-flex;
	flex-wrap:wrap;
	webkit-flex-wrap: wrap;   
	width: 100%;
	margin-bottom: 60px;
	gap: 80px 5%;
	
}

.ranking_content{
	margin: 0 0% 0 0%;
	width: 30%;
}

.ranking_content a{
	color: 000;
	text-decoration: none;	
}

.ranking_image{
	width: 100%;
}

.ranking_image img{
	width: 100%;
}

.itemname{
	margin-top: 10px;
	display:block;
	text-align: left;
	font-size: 16px;
	color: #000;
	text-decoration: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 400;
	font-style: normal;
	letter-spacing: .05em;
	line-height: 1.7em;
}

span {
  display: inline-block;
  font-style: 300;
  font-size: 14px;
  color: #4d4d4d;
}

span02 {
  display: inline-block;
  font-style: 300;
  font-size: 16px;
  line-height: 2.5em;
  color: #000;
}


.about_image{
	margin-top: 100px;
	position: relative;
	width: 100vw;
	height: 800px;
}

.about_bg{
	position: absolute;
	width: 100%;
	height: 800px;
	z-index: 2;
}

.about_bg img{
  width: 100%; /* 全画面表示 */
 height: 100%;
  object-fit: cover;
  
}

.about_logo{
	position: absolute;
	padding-top: 100px;
	padding-left: 400px;
	width: 350px;
	z-index: 5;
}

.about_logo img{
	width: 100%;
}


.about_text{
	width: 550px;
	position: absolute;
	padding-left: 400px;
	padding-top: 300px;
	display:block;
	text-align: left;
	font-size: 13px;
	color: #fff;
	text-decoration: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 500;
	letter-spacing: -.01em;
	line-height: 2.5em;
	z-index: 7;
}

.endcredit_image{
	position: relative;
	width: 100vw;
	height: 250px;
}

.endcredit_bg{
	position: absolute;
	width: 100%;
	height: 250px;
	z-index: 4;
}

.endcredit_bg img{
  width: 100%; /* 全画面表示 */
  height: 100%;
  object-fit: cover;
  
}

.endcredit_box{
	position: absolute;
	width: 500px;
	right: 0;
	padding-top: 50px;
	padding-right: 80px;
	
}

.credit_logo{
	position: relative;
	right: 0px;
	display:block;
	text-align: right;
	font-size: 14px;
	color: #fff;
	text-decoration: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 500;
	letter-spacing: -.01em;
	line-height: 2.5em;
	z-index: 10;
}

.endcredit{
	position: relative;
	padding-top: 10px;
	display:block;
	text-align: right;
	font-size: 10px;
	color: #fff;
	text-decoration: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 500;
	letter-spacing: -.002em;
	line-height: 1.6em;
	z-index: 7;
	
}


.pallink {
	float: right;
	position: relative;
	padding: 0.5em;
	display: block;
	height: 10px;
	width: 150px;
	text-align: center;
	text-decoration: none;
	font-size: 8px;
	letter-spacing: 0.05em;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 500;
	color: #000;
	background: #fff;
	margin-top: 20px;
	z-index: 20;
}

.pallink a {
	color: #000;
	text-decoration: none;
}


#newstag{
	
}

#rankingtag{
	
}

#abouttag{
	
}

.sp_logo{
	display: none;
	position: absolute;
	padding-top: 50px;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 80vw;
	z-index: 40;
}

.sp_logo img{
	width: 100%;
}


 /*スクロール*/
.scrolldown1{
    /*描画位置※位置は適宜調整してください*/
    display: none;
	position:absolute;
	left:50%;
	bottom:10px;
    /*全体の高さ*/
	height:50px;
	z-index: 41;
}

/*Scrollテキストの描写*/
.scrolldown1 span{
    /*描画位置*/
	position: absolute;
	left:-20px;
	top: -15px;
    /*テキストの形状*/
	text-align: center;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 500;
	color: #fff;
	font-size: 1.0rem;
	letter-spacing: 0.05em;
}

/* 線の描写 */
.scrolldown1::after{
	content: "";
    /*描画位置*/
	position: absolute;
	top: 0;
    /*線の形状*/
	width: 1px;
	height: 30px;
	background: #fff;
    /*線の動き1.4秒かけて動く。永遠にループ*/
	animation: pathmove 1.4s ease-in-out infinite;
	opacity:0;
}

/*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove{
	0%{
		height:0;
		top:0;
		opacity: 0;
	}
	30%{
		height:30px;
		opacity: 1;
	}
	100%{
		height:0;
		top:50px;
		opacity: 0;
	}
}

 /*スクロール*/


.spmenu{
	display: none;
	position: fixed;
	left: 0;
	bottom:0;
	width: 100%;
	height: 75px;
	text-align: center;
	box-sizing: border-box;
	z-index: 999;/*最前面へ*/
	background-color: #fff;
	/*デフォルトで非表示にする*/
	transition: 1s;
  opacity: 0;
  visibility: hidden;
	
}

/*このクラスが付与されると表示する*/
.active{
  opacity: 1;
  visibility: visible;
}


.bottomlink{
	display: flex;
	display: -webkit-flex;
	top:0;
	right: 0;
	width: 94%;
	margin-right:0px;
	margin-top: 6px;
	padding-left: 3%;
	padding-right: 3%;
	gap: 0px 4%;
}



.linkimg{
	width: 50%;
	padding:0px 0px;
}

.linkimg img{
	width: 100%;
}

.overflow{
	overflow:hidden;	
	}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }


.news_aki{
	padding: 30px;
}


/* SP */


@media screen and ( max-width : 750px ){
.hero {
  position: absolute;
	top: 0;
	left:0;
	width: 100vw;
	height:75vh;
background-color:#f1eee6;
}
	
.news_aki{
	display: none;
	padding: 30px;
}
	
.sidemenu_white{
  display: none;
}	
	
.sidemenu{
  display: none;
}
	
.sidebg{
	 display: none;	
}
	
.sp_logo{
	display: block;
}
	
.titletext{
	position:absolute;
    display: block;
    text-align: right;
	font-size: 4.2rem;
	color: #fff;
	text-decoration: none;
	font-family: 'expressway', sans-serif;
	font-weight: 300;
	font-style: normal;
  letter-spacing: -0.02em;
  line-height: 0.8em;
  bottom:12vh;
  right: 0px;
  padding-right: 5%;
  z-index: 28;
}
	
.slide-img img{
  position: static;
  height: 90vh; /* 全画面表示 */
  object-fit: cover;
}
	
.scrolldown1{
	display: block;
	}
	
.contents_box{
	position: relative;
	display:block;
	margin-top: 100px;
	padding-left:5%;
	padding-right:5%;
}
	
.news_content{
	width: 100%;
	float: none;
}

	
.sex_box{
	display: none;
}

.sex_box_sp{
	display: flex;
}
	
	
.simple_square_btn5 {
	display: block;
	position: relative;
	float: none;
	height: 20px;
	width: 200px;
	padding: 1em;
	text-align: center;
	text-decoration: none;
	font-size: 13px;
	letter-spacing: 0.05em;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 500;
	color: #fff;
	background: #1e3a58;
	margin: 0 auto;
	margin-bottom: 100px;
}
	
.about_logo{
	position: absolute;
	padding-top: 30px;
	padding-left: 10%;
	padding-right: 10%;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 70%;
}
	
.about_text{
	width: 84%;
	position: absolute;
	padding-left: 8%;
	padding-right: 8%;
	padding-top: 180px;
	display:block;
	text-align: left;
	font-size: 11px;
	color: #fff;
	text-decoration: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 500;
	font-weight:500;
	letter-spacing: -.03em;
	line-height: 2em;
	z-index: 7;
}

.ranking_content{
	width: 47.5%;
}
	
.itemname{
	margin-top: 10px;
	display:block;
	text-align: left;
	font-size: 12px;
	color: #000;
	text-decoration: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 400;
	font-style: normal;
	letter-spacing: .05em;
	line-height: 1.5em;
}
	
span {
  display: inline-block;
  font-style: 300;
  font-size: 12px;
  color: #4d4d4d;
}
	

	
.endcredit_image{
	height: 290px;
}

.endcredit_bg{
	height: 290px;
	z-index: 4;
}


.endcredit_box{
	position: absolute;
	width: 100%;
	right: 0;
	left:0;
	padding-top: none;
	padding-right: none;
	margin:-20px auto;
	
}

.credit_logo{
	position: relative;
	right: none;
	display:block;
	text-align: center;
	font-size: 16px;
	color: #fff;
	text-decoration: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 500;
	letter-spacing: -.01em;
	line-height: 2.5em;
	z-index: 10;
}

.endcredit{
	position: relative;
	padding-top: 5px;
	display:block;
	text-align: center;
	font-size: 8px;
	color: #fff;
	text-decoration: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 500;
	letter-spacing: 0em;
	line-height: 1em;
	z-index: 7;
	
}


.pallink {
	float: none;
	position: relative;
	padding: 0.9em;
	display: block;
	height: 14px;
	width: 180px;
	text-align: center;
	text-decoration: none;
	font-size: 10px;
	letter-spacing: 0.05em;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: 500;
	color: #000;
	background: #fff;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	z-index: 20;
	
}
	
.newstitle{
	font-size: 2.2rem;
	margin-bottom: 10px;
	letter-spacing: 0.03em;

}


.days{
	margin-bottom: 9px;
	font-size: 12px;
	}
	
.newstext{
	margin-bottom: 60px;
	font-size: 14px;
	border-bottom: solid .7px black;
	padding-bottom: 30px;
}
	
.newstext02{
	margin-bottom: 10px;
	font-size: 14px;
	border-bottom: solid .7px black;
	padding-bottom: 30px;
}	
	
.news_box{
	display: block;
	width: 100%;
	margin-bottom: 0px;
}
	
.spmenu{
	display: block;
	}
	
.pc { display: none !important; }
    .sp { display: block !important; }

.newsmore{
	margin-bottom: 50px;
	}
	
.about_image{
	height: 900px;
	margin-top: 70px;
}
	

.about_bg{
	height: 900px;
}
	
.homelook{
  display: none;
}
	
.seasonsp{
	display: block;	
}
	
.ranking_1_6{
	margin-bottom: 30px;
	gap: 50px 5%;
	
}
	
.ranking_box{
	margin-bottom: 60px;
}
	
	
}