@charset "utf-8";
/* ===================================================================
 style info : ヘッダーやフッターなどサイト内共通
=================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;800&display=swap');
:root{
	--border-color:#f9df7b;
	--main-color:#b57e10;
	--mint-color:#7cddc8;
	--gold-gradient:linear-gradient(to bottom,  #cc9e36 0%,#f1e767 50%,#cca13b 100%); 
	--gold-gradient02: linear-gradient(to bottom,  #9e701f 0%,#ffdf60 50%,#dca144 100%);
	--text-shadow:#9c6f2d 1px 1px 2px, #9c6f2d -1px 1px 2px,#9c6f2d 1px -1px 2px, #9c6f2d -1px -1px 2px;


}

/*----------------------------------------------------
header#globalHeader
----------------------------------------------------*/
header#globalHeader { margin-bottom: 5px; background-image:url("../img/header.png"); height: 185px; position: relative; width: 1000px;}

header#globalHeader h2{font-family: "Shippori Mincho", serif;font-weight: 800;
	text-shadow:#fff 1px 1px 2px,#fff -1px 1px 2px,#fff 1px -1px 2px,#fff -1px -1px 2px;
	color:var(--main-color);
	font-size: 108%;text-align: right;
	padding:10px 25px 0 0;
}
header#globalHeader h1 a{
	width: 450px;
	height: 150px;
	float: left;

	text-indent: -99999px;
}
	
#line_box { position:absolute; top:5px; margin-left:235px; width:178px; text-align: center; height: 350px; overflow: hidden; right: -190px; background-color: #FFF; border: solid 3px transparent;border-image:url("../img/gold_gradient_bg.jpg");border-image-slice: 1;border-image-repeat: stretch;font-size:16px; font-weight:bold;  }
#line_box img{ vertical-align:bottom;margin-bottom: 15px}
#line_box form{ font-size:16px; font-weight:bold; padding: 0px 0px 5px 15px; text-align: left; line-height: 1.6em; }
#line_box form input{ width:70px}
/*-トップ--------------------------------------------*/
#top_contents {
	float: right;
	width: 799px
}
#contents #top_left{
	width:544px;
	float:left;

}
.flabox{
	width:544px;
	height:340px;
	background-color: #fff;
	margin-bottom:5px;
	overflow: hidden;
}
.newface{
	width:542px;
	height:258px;
	margin-bottom:10px;
	/*border: 1px solid var(--border-color);*/
}
.newface h1,.newface h2{ height:46px;margin: 0}
#mycarousel li a .pic{
	width:111px;
	height:148px;
	display:block;
	margin: 0 0 2px 0;
}
 .jcarousel-skin-tango{border: 1px solid var(--border-color);}
.pickup{
	width:542px;
	height:258px;
	background-image:url("../img/pickup_bg.png");
	border: 1px solid var(--border-color);
	position: relative;
	margin-bottom: 5px;
}
#slider{ margin:7px; float:right;width:290px;}
#slider li{
	width:290px;
	padding: 10px;
	border: 1px solid var(--main-color);
	box-shadow: 0px 3px 5px 0px rgba(181,126,16, 0.35);
	background-color: #fff;
	height: 220px;
	position: relative;
}
.ranking_name{font-family: "Shippori Mincho", serif;font-weight: 800;
	display:block;
	float:left;
	width:120px;
	color:#8904cc;
	font-size:116%;
}
.ranking_size{color:var(--main-color);
	display:block;
	float:left;
	width:120px;
	font-size:100%;
}
#slider li a{display: flex;}
#slider li a .disc{display: flex;flex-direction: column}
#slider li .pic{
	float: left;
	margin-right: 5px;
	width: 165px;
	height: 220px;
}
.pickup_badge{
	position:absolute;
	top:-16px;
	width: 125px;
	height: 125px;
	display: block;
	left: -15px;
	z-index: 5
}
#contents #top_right{
	width:250px;
	float:right;
}
.whatnew{
	width:248px;
	border:solid 1px var(--border-color);
	background-color:#fff;
	margin-bottom: 5px;
	float: left;
}
.update{
	width:248px;
	background-color:#fff;
	float: left;
}
.whatnew h1,.update h1,.whatnew h2,.update h2{ height:46px;}
.t_box{
	margin:0;
	width:238px!important;
	height:394px;
	padding:10px 0 10px 10px;
	overflow:auto;
	float:left;
	background:#fff;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	border-radius:3px;
	color: #1E1E1E;
}
.t_box ul li{
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: var(--main-color);
}
.t_box ul li img{max-width:218px;}
.t_box ul li .title{
	font-weight: bold;
	border-bottom:dotted 1px #666666;
	margin-bottom:5px;
	font-size:123.1%;
	color:var(--main-color);
}
#main #today_sche{
	border:solid 1px var(--border-color);
	background:url("../img/bg.webp")repeat,#f7ebff;
	margin-bottom: 5px;
	float: left;
	padding-bottom: 10px;
}
#main #today_sche h1,#main #today_sche h2{background: #fff}
/*#main #sche,*/#main #event,#main #system,#main #link{
	border:solid 1px var(--border-color);
	background-color:#fff;
	margin-bottom: 5px;
	float: left;
	padding-bottom: 10px;
}

#system .text24,#map .text24{color:var(--main-color);display: block;padding: 30px 15px}
#sche, #g_list{

	background-color:#fff;
	margin-bottom: 5px;
	float: left;
	padding-bottom: 5px;
}

#g_list .g_list,#sche .g_list{
	background:url("../img/bg.webp")repeat,#f7ebff;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-right-color: var(--border-color);
	border-bottom-color: var(--border-color);
	border-left-color: var(--border-color);
}
#g_list{position: relative}
#search { position: absolute; top:9px; right:10px; z-index: 100; font-size:16px; width: 204px; float: right;color: var(--main-color) }
.textbox { padding:3px; width:100px; border: 2px solid var(--main-color); }
.kensaku_b { padding:2px 5px; }
.kensaku_b {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  background-color: var(--main-color);
  --padding-x: 1.2em;
  border-color: transparent;
  color: white;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: 0.2s;
}
.kensaku_b:hover {
  background-color: #9c6f2d;
}
.kensaku_b:focus {
  outline: none;
}
.kensaku_b:active {
  transform: translateY(2px);
}



#link .pad10 img{border: 1px solid #fff;margin-bottom: 10px}
.icon_newface{
	position:absolute;
	width:50px;
	left: 128px;
	top: 206px;z-index: 10
}
.icon_box_sche{
	position:absolute;
	width:50px;
	left: 128px;
	top: 30px;z-index: 10
}
.icon_s_box_sche{
	position:absolute;
	width:40px;
	left: 10px;
	top: 206px;z-index: 10
}
.icon_nf_box_sche{	position:absolute;
	width:50px;
	left: 128px;
	top: 30px;z-index: 10}
.icon_box{
	position:absolute;
	width:50px;
	left: 127px;
	bottom: 245px;z-index: 10
}
.icon_nf_box{	position:absolute;
	width:50px;
	left: 135px;
	top: 10px;z-index: 10}
.icon_s_box{
    position: absolute;
    width: 40px;
    left: 18px;
    top: 181px;
    z-index: 10
}
.icon_newface02{
	position:absolute;
	width:50px;
	left: 127px;
	top: 180px;z-index: 10
}
.icon_work{
	position:absolute;
	width:73px;
	left: -1px;
	top: -1px;z-index: 10
}
.icon_af{
	position:absolute;
	left: 140px;
	top: 28px;
}
.icon_af02{
	position:absolute;
	left: 138px;
	top: 8px;
}
ul.tab {
	margin: 0 !important;
	padding: 0;
	border-bottom: 2px var(--border-color) solid;
}
ul.tab li {
	float: left;
	margin: 5px 0 0 5px;
	position: relative;
	bottom: -2px;
	list-style-type: none;
	border: 1px var(--border-color) solid;
	border-top: none;
	border-bottom: 2px var(--border-color) solid;
	font-size:108%;
	line-height: 2em;
}
ul.tab li.none {
	border-bottom: 2px var(--border-color) solid;
	font-weight: bold;
	background-color: #fff;
}
ul.tab li a {
	display: block;
	padding: 3px 1.5em 5px;
	text-decoration: none;

}
ul.tab li a.grey {
	color: var(--main-color);
	border-top-width: 5px;
	border-top-style: solid;
	border-top-color: var(--main-color);

}
ul.tab li a.violet {
	color: #9933CC;
	border-top-width: 5px;
	border-top-style: solid;
	border-top-color: #9933CC;

}

ul.tab li a:hover {
	position: relative;
	bottom: 6px;
}
/* clerfix */
.clear:after {
    content:"";
    display:block;
    overflow:hidden;
}
.clear:after {
    clear:both;
}
.clear {
    zoom:1;
}
/*テーブル------------------------------------------------*/
table.bordered {
    *border-collapse: collapse; /* IE7 and lower */
    border-spacing: 0;
    width: 100%;    
}
.bordered {
    border: solid #ccc 1px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
       
}
.bordered tr{
	color: #000;
	background-color: #FFF;
}
.bordered tr:hover {
	-o-transition: all 0.1s ease-in-out;
	-webkit-transition: all 0.1s ease-in-out;
	-moz-transition: all 0.1s ease-in-out;
	-ms-transition: all 0.1s ease-in-out;
	transition: all 0.1s ease-in-out;
	background-color: #FF0000;
	color: #FFF;
}    
    
.bordered td, .bordered th {
    border-left: 1px solid #ccc;
    border-top: 1px solid #ccc;
    padding: 10px;
    text-align: left;    
}

.bordered th {
	background-color: #fff;

	-webkit-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
	-moz-box-shadow:0 1px 0 rgba(255,255,255,.8) inset;
	box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
	border-top: none;
	text-shadow: 0 1px 0 rgba(255,255,255,.5);
	color: #FFF;
}


#system .bordered{
	font-size: 197%;
	font-weight: bold;
}

/*リンク*/
.link_box{
	clear:both;
	display: block;
	width: 777px;
	padding: 10px;
}
.link_box div{
	text-align:center;
	float:left;
	width:88px;
	margin-bottom:5px;
	overflow: hidden;
	margin-right: 10px;
	display: block;
}
.link_box span{
	display:block;
	font-size:12px;
	margin:1px 0px;
	width: 88px;
	height: 12px;
	float: left;
	clear: left;
	text-align: center;
	overflow: hidden;
}
a .pick_comm,a:link .pick_comm,a:hover .pick_comm,a:visited .pick_comm{
	float:left;
	width:120px;
	margin-top:10px;
	height: 160px;
	overflow-y:scroll;
	overflow-x:hidden;
	position: absolute;
	left: 181px;
	top: 58px;
}
.ranking_icon{	float:left;
	width:137px;}
	
	
 #today_sche .g_list li a .pic{
	height:220px;
	width: 165px;
}
#today_sche .scroll,#sche .scroll{
	height:90px;
	width: 155px;
	overflow-y:scroll;
	overflow-x:hidden;
	background-color:#fcf2d2;
    padding: 5px 5px;
}
#g_list .scroll{
	height:105px;
	width: 155px;
	overflow-y:scroll;
	overflow-x:hidden;
		background-color:#fcf2d2;
    padding: 5px 5px;
}
/*イベント*/
#event{ color:#1E1E1E}
#event ul li{ display:block; float:left; width:777px;border-bottom: 1px dotted var(--border-color);margin-bottom: 30px; padding-bottom: 30px}
#event ul li:last-child{border-bottom:none}
#event ul li img{ float:left; margin-right:5px;}
#event .pad10 li .date{ display:block; float:left; width:777px}
/* top 今月のランキング*/
/*今月のランキング*/
.ranking-container {
  display: grid;
  grid-template-columns: 11fr 6fr 6fr; /* 横幅比 11:6:6 */
  grid-template-rows: repeat(2, 1fr); /* 2行 */
  gap: 8px;
  padding: 8px;
  box-sizing: border-box;
}
.ranking-container a {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
}
/* ランキング位置設定 */
.ranking-container a:nth-child(1) {
  grid-area: 1 / 1 / 3 / 2;
} /* 1位: 左に縦2マス */
.ranking-container a:nth-child(2) {
  grid-area: 1 / 2 / 2 / 3;
}
.ranking-container a:nth-child(3) {
  grid-area: 1 / 3 / 2 / 4;
}
.ranking-container a:nth-child(4) {
  grid-area: 2 / 2 / 3 / 3;
}
.ranking-container a:nth-child(5) {
  grid-area: 2 / 3 / 3 / 4;
}
/* 画像ラッパー（3:4比率） */
.ranking-container .image-wrapper {
  position: relative;
  width: 100%;
  flex-grow: 1;
}
.ranking-container .image-wrapper::before {
  content: '';
  display: block;
  padding-top: calc(4 / 3 * 100%); /* アスペクト比 3:4 */
}
.ranking-container .image-wrapper img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* リボン共通 */
.ranking-container .ribbon {
  background: red;
  color: white;
  font-weight: bold;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  clip-path: polygon(0 0, 100% 0, 100% 70%, 50% 100%, 0 70%);
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* リボンナンバリング（CSSで表示） */
.ranking-container a:nth-child(1) .ribbon::before {
  content: "1";
}
.ranking-container a:nth-child(2) .ribbon::before {
  content: "2";
}
.ranking-container a:nth-child(3) .ribbon::before {
  content: "3";
}
.ranking-container a:nth-child(4) .ribbon::before {
  content: "4";
}
.ranking-container a:nth-child(5) .ribbon::before {
  content: "5";
}
/* リボンのサイズ（1位は大きく） */
.ranking-container a:nth-child(1) .ribbon {
  width: 50px;
  height: 50px;
  font-size: 28px;
}
.ranking-container a:nth-child(n+2) .ribbon {
  width: 30px;
  height: 30px;
  font-size: 18px;
}
.ranking-container .ribbon::before {
  line-height: 1;
}
.ranking-container .name {
  font-size: 16px;
  text-align: center;
  margin-top: 5px;
}
/* top ピックアップ*/
.pickup_girl ul{display:flex; flex-direction: row;}
.pickup_girl ul li{
border: solid 1px var(--main-color);
    background-color: #fff;
    margin: 5px 5px 0;
    text-align: center;
    width: calc(100% / 3);
    padding: 5px;
    position: relative;
    display: block;
    color: #1E1E1E;}

.pickup_girl ul li .image-wrapper img{width: 100%}
.pickup_girl ul li{font-size: 93%}
 
.t_box2{
	margin:0;
	width:238px!important;
/*	height:952px;*/
	padding:10px 0 10px 10px;
	overflow:auto;
	float:left;
	background:#fff;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	border-radius:3px;
	color: #1E1E1E;
}
.t_box2 ul li{
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: var(--main-color);
}
.t_box2 ul li img{max-width:218px;}
.t_box2 ul li .title{
	font-weight: bold;
	border-bottom:dotted 1px #666666;
	margin-bottom:5px;
	font-size:123.1%;
	color:var(--main-color);
}
 
#top_event ul{margin-bottom: 0!important;}


#top_contents {
  display: flex;align-items: stretch;justify-content: space-between;
}

#top_left {
  /* flexsliderの高さに準ずる */
}

#top_right {
float: right;
  display: flex;
  flex-direction: column; /* 縦方向に並べる */
  gap: 10px
}

#top_right .whatnew {
  flex: 1; /* 残りの高さを全部使う */
  overflow: auto; /* 内容が多い場合スクロール */
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
}
#top_right .whatnew .t_box2 {
overflow: auto;  height:990px;
}
#top_right .update {
  height: 397px; /* 固定高さの例 */
  margin-bottom: 10px
}

.flexslider{height: 378px;}
.flexslider ul li a{display: flex; align-items: center;height: 378px;}