/*----画面サイズが719px以下で固定メニューを消しドロワーメニューを出す----------*/

@media screen and (min-width:720px){
	.open { display: none; }
	.menu_drw { display: none; }
	#menu li { display:inline; }
}
/*--削除	.menu_drw li { display: none; }    ----------*/

@media screen and (max-width:719px) {
	.open { display: block; }
	#menu { display:none; }
	.return { display:none; }
}

/*============ ドロワーメニュー始 ========*/
/* :::::: toggle button :::::: */
#navTgl {
  display: none;
}
 
label.open,
label.close {
  cursor: pointer;
  position: fixed;
  top: 2px;
  left: 0;
}

/*--　メニュー閉--*/ 
.open {
  z-index: 2;
  width:45px;
  height:80px;
  -webkit-transition: background-color .6s, -webkit-transform .6s;
  transition: background-color .6s, transform .6s;
}

/*--　メニュー開--*/ 
#navTgl:checked + .open {
  -webkit-transform: translateX(190px);
  transform: translateX(190px);
}
 
.close {
  pointer-events: none;
  z-index: 1;
  width: 100%;
  height: 100%;
  transition: background-color .6s;
}
 
#navTgl:checked ~ .close {
  pointer-events: auto;
  background-color: rgba(0,0,0,.3);
}
 
/* :::::: drawer menu :::::: */
.menu_drw {
	z-index: 1;
	position: fixed;
	overflow: auto;
	top: 0;
	left: 0;
	width: 190px;
	height: 100%;
	background-color: rgba(0,0,0,.6);
	-webkit-transform: translateX(-100%);
	transform: translateX(-100%);
	-webkit-transition: -webkit-transform .6s;
	transition: transform .6s;
}
 
#navTgl:checked ~ .menu_drw {
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

.menu_drw li {
  border-bottom: 1px solid rgba(255,255,255,.6);
  font-size:17px;
  line-height: 1.2;
}

.menu_drw li a {
  color: white;
  display: block;
  padding: 0.8em;
  text-decoration: none;
  transition: background-color .6s;
}

.menu_drw li a:hover {
  color:yellow ;
  background-color:#191970 ;
}

.menu_drw ul {
  padding: 0;
  list-style-type:none;
} 
 
.menu_drw li:first-child {
  border-top: 1px solid rgba(255,255,255,.6);
}

.mini_list{
	font-size:13px;
	background-color: rgba(30,144,255,.6);
}

/*============ ドロワーメニュー終 ========*/

/*基本設定===============================*/
body {
  margin:0;
  padding:0;
  background-color:#f8f8ff;
  display:block/*===resp追加===*/
}

img {
	border:none;
}

.img-arnd{
	margin:2px;
	}

.fs11{
	font-size:11px;
	background:#66cdaa;
}

.fs13{
	font-size:13px;
	padding:3px;
	background:#f0f8ff;
	text-align:center;
}

.fs14{
	font-size:14px;
	padding:3px 1em;
}

.fs15{
	font-size:15px;
	padding:3px;
	background:#FF69A3;
	text-align:center;
}

.ikou18now{
	font-size:15px;
	line-height:110%;
	padding:5px;
	margin:0 0 0 1em;
	background-color:#ffe4e1;
}

.ikou18{
	background:#ff0000;
	color:white;
	margin:0 0 1em 1em;
	padding:3px;
	font-size:15px;
}

.ikou18c{
	background:#1e90ff;
	color:white;
	margin:0 0 1em 1em;
	padding:3px;
	font-size:15px;
}

.ikou18cc{
	line-height:120%;
	padding:4px;
	margin:2px;
	border:inset 4px #0000ff;
	background:white;
	color:black;
}

.ikou18a{
	line-height:120%;
	padding:4px;
	margin:2px;
	border:inset 4px #ff0000;
	background:white;
	color:black;
}

a:link { text-decoration:none; color:black ;}
a:visited { text-decoration:none; color:black ; }
a:active { text-decoration:none; color:#FF7575 ;}
a:hover { text-decoration:underline; color:blue;}

h1 {
	background-color:#005B99;
	color:white;
	font-size:18px;
	margin: 0.5em 0;
	padding:12px 1em;
	border-radius: 2px;
}

h2 {         
	font-size:17px;
	margin:3px;
	padding:8px;
	background-color:#87CEFA;
	border-radius: 2px;
}

h3 {         
	font-size:15px;
	margin:3px;
	padding:6px;
	background-color:#add8e6;
}

h4 {
    font-size:15px;
    background-color:#E3F4FF;
    margin:1em 3px 3px 3px;
    padding:5px;
    text-align:left;
}

.rot {
	color:#ff0000;
	font-weight:bold;
}

.blau{
	color:#0000cc;
}

.recht{
	text-align:right;
	margin-bottom:1em;
}

.wari23{
	color:red;
	background:#FFF0F5;
	padding:2px;
}

.webmaill{
	width:55%;
	float:left;
	padding:0.5em;
}

.webmailr{
	width:40%;
	float:right;
	padding-top:2em;
}

.webmailc{
	text-align:center;
	margin-bottom:1em;
	width:100%;
	clear:both; 
}


/* ▼表示領域が719px未満の場合*/
@media screen and (max-width:719px) {
body {
	font-size:13px;
	background-color:#ffffff;
}

td{
	font-size:12px;
}

h1 {
  font-size:16px;
  text-align:center;
  margin: auto;
  padding:12px 1em;
  }

h2 {         
	font-size:15px;
	margin:3px;
	padding:2px;
}

.webmaill{
	float:none;
	width:100%;
	text-align:center;
}

.webmailr{
	float:none;
	width:100%;
	text-align:center;
	padding-top:0;
}


}/* ▲表示領域が719px未満の場合*/

/*menu===============================*/
#menu li {
	display:inline;
	list-style-type:none;
}

#menu ul {
	padding-left:1.4em;
}

/*menu2===============================*/
.menu2 li {
	display:inline;
	margin:8px;
	padding:8px;
	list-style-type:square;
}
.menu2 ul {
	border:#ff0000 solid 2px;
	border-radius:7px;
	padding:8px;
	width:90%;
	text-align:center;
}

/*-----------------------------------見出しの画像用 */
.midashi {
	margin-left:1em;
	padding-right:2px;
	width:14px;
}

/*-----------------------------------headerの指定*/ 
#header {
  margin: 0;
  padding: 0;
  text-align:center;
  width:100%;
}

/*========================resp追加 heder・footerの画像切り替え===*/
div.resizeimage img { width:100%;}

/* ▼表示領域が720px以上の場合*/
@media screen and (min-width:720px){
	img.mini { display:none; }/*---title画像の切り替え */
	img.big { display:block; }
	
	img.sp { display:none; }/*---subtitle画像の切り替え */
	img.pc { display:block; }
	
	.resizemvno img{ width:670px; }
	.resizeauto img{ width:auto; }
}

/* ▼表示領域が719px未満の場合*/
@media screen and (max-width:719px) {
   img.mini { display:block; }/*---title画像の切り替え */
   img.big  { display:none; }
   
   img.sp { display:none; }/*---subtitle画像の切り替え */
   img.pc { display:none; }/*---subtitle画像の切り替え */
               
   .resizemvno img{ width:95%; }
   .resizeauto img{ width:96%; }

	.brresp:before {
	content: "\A" ;/*---直前の改行を意味 */
	white-space: pre ;/*---直前の改行を意味 */
	padding:0;
	margin:0;
	}
	.spdl{
	display:none;
	}/*---消去共通クラス */
}

/*-----------------------------------wrapperの指定*/
#wrapper {
  background-color:#fff;
  margin: 0 auto;
  padding: 0;
  text-align: left;
  width: 1024px;
}
/* ▼表示領域が719px未満の場合*/
@media screen and (max-width:719px){
 #wrapper{
 background:#fff;
 margin:0 auto;
 padding:0;
 text-align:left;
 width:100%;
 min-width:320px;
}
}

/*-----------------------------------indexメイン左の指定*/
#left_sidebar{
  float: left;
  margin: 0;
  padding-left: 5px;
  width: 400px;
  }
/* ▼表示領域が719px未満の場合*/
@media screen and (max-width:719px) {
#left_sidebar{
	clear:left;
	width:96%;
	margin:auto;
	padding-left: 0.5em;
	}
#news{
	padding-left:2em;
	margin-left:2em;
	}
}

/*-----------------------------------indexメイン中央の指定*/
#contents{
  float: left;
  margin: 0;
  padding: 2px 8px;
  width: 420px;
}
/* ▼表示領域が719px未満の場合*/
@media screen and (max-width:719px){
#contents{
  width:94%;
  text-align:center;
}
}

/*-----------------------------------indexメイン右の指定*/
#right_sidebar {
  float: right;
  background-color:white;
  margin: 0;
  padding: 0;
  width: 180px;
  text-align:center;
}

/* ▼表示領域が719px未満の場合*/
@media screen and (max-width: 719px) {
#right_sidebar{
	clear: both;
	width:98%;
	text-align:center;
  }

#right_sidebar hr { display:none; }

}
/*-----------------------------------footer(上段)の指定 */
#footerp {
  background-color:#90ee90;
  clear: both;
  font-size:15px;
  padding:0.5em;
  text-align:right;
}

#footerp ul {
	margin:0;
	padding:0;
}

.ftmr {
  font-size:14px;
  margin-right:0.5em;
}

#footerp li {
	display:inline;
	list-style-type:none;
}

/*-----------------------------------footer(下段)の指定*/
#footer {
  background-color:#66cdaa;
  clear: both;
  font-size:16px;
  margin: 0px;
  padding: 5px;
  text-align: center;
}
.footer-b{
	font-size:15px;
	padding:3px;
}
/* ▼表示領域が719px未満の場合*/
@media screen and (max-width: 719px) {
#footer{ 
  font-size:12px;
  }
  .footer-b{
	font-size:11px;
}
#footerp a {
  padding:2px;
  font-size:12px;
}
}

.ftblnk {
	margin-left:1em;
}

/*-----------------------------------indexメイン左の中身*/
#ls1 {
 margin-left:1em;
}

#news {
 background-color:#3366cc;
 color:white;
 font-weight:bold;
 margin:2px;
 padding:5px 0.5em;
}
 
#innews {
 background-color:#ff6666;
 color:white;
 font-weight:bold;
 margin:2px;
 padding:3px;
}
 
#stop {
 background-color:#000099;
 color:yellow;
 font-weight:bold;
 margin:2px;
 padding:5px 0.5em;
}

.info-p {
 background-color:#ffffe0;
 font-size:14px;
 margin:3px;
 text-align:left;
}

.info1 {
 background-image : url(../yc_image/img_menu/icon_red.gif);
 background-position: 3px 7px;
 background-repeat: no-repeat;
 border-bottom:1px #cc6600 dashed;
 margin:1px;
 padding:2px 0 2px 1.3em;
}

.info10 {
 background-image : url(../yc_image/img_menu/icon_red.gif);
 background-position: 3px 7px;
 background-repeat: no-repeat;
 border-bottom:1px #cc6600 dashed;
 margin:1px;
 padding:5px 0 3px 1.3em;
 font-size:12px;
}

.info2 {
 background-image : url(../yc_image/img_menu/icon_blue.gif);
 background-color:#D9E5FF;
 background-position: 3px 7px;
 background-repeat: no-repeat;
 border-bottom:thin orange dashed;
 margin:1px;
 padding:2px 0 2px 1em;
 font-size:90%;
}

.info3 {
 background-image : url(../yc_image/img_menu/icon_red02.gif);
 background-position: 3px 7px;
 background-repeat: no-repeat;
 border-bottom:1px #cc6600 dashed;
 margin:1px;
 padding:2px 0 3px 1em;
}

.info_mnt {
 background-image : url("../yc_image/img_menu/icon_red.gif");   
 background-position: 3px 7px;   
 background-repeat: no-repeat;   
 border-bottom:1px #FFD700 dashed;   
 margin:1px;   
 padding:5px 0px 3px 1.3em;   
 font-size:13px;   
}   
  
.info-mnt_btm{   
 padding:1px 1px 2px 1.1em;   
 clear:both;   
 margin:1px;   
 height:14px;   
}   
  
.info-mnt_btmr{   
 color:#003f8e;   
 margin:1px;   
 padding:2px;   
}   

.info-around{/*height:90px;*/
 background-color:white;
 border:1px black solid;
 padding:3px;
 margin:3px 3px 0.5em 7px;
 height:90px;
}

.info-arounds{
 font-size:90%;
 background-color:white;
 border:1px yellow solid;
 padding:0.5em;
 margin:3px;
}

/* ▼表示領域が719px未満の場合*/
@media screen and (max-width: 719px) {
.info-around{display:none;}
}
/* ▲表示領域が719px未満の場合*/

.info-smmr{
 font-size:15px;
 padding:1px;
 line-height:100%;
}

.info-smmrr{
 font-size:14px;
 padding:1px;
 line-height:100%;
 clear:both;
 text-align:right;
}

.infottl {
 border:1px solid white;
 color:white;
 float:right;
 font-size:13px;
 padding:0 5px;
 margin:0 2px;
}

.info-smmr{
 padding:1px;
 line-height:100%;
 clear:both;
}

.info-smmr_p{
 padding:1px;
 clear:both;
 margin:1px 1px 2px 1px;
 font-size:90%;
}

.info-smmr_p2{
 padding:1px 1px 2px 1.5em;
 clear:both;
 margin:1px 1px 5px 1px;
 font-size:14px;
 height:30px;
}

.info-smmr_p2 span{
	padding-top:5px;
}

.info-smmrss{
 font-size:13px;
 padding:5px;
 line-height:100%;
 clear:both;
 background-color:yellow;
}
.info-smmrsss{
 font-size:12px;
 padding:3px;
 line-height:100%;
 clear:both;
 background-color:#FF3366;
}

.info-hdl{
 background-color:#003f8e;
 border: 1px solid white;
 color:yellow;
 float:left;
 height:99%;
 margin:auto;
/* padding:auto;*/
 text-align:center;
 vertical-align:top;
 width:11%;
}

.info-dtl{
 border-bottom:thin orange dashed;
 color:#003f8e;
 float:right;
/*padding:auto;1px;*/
 width:88%;
 height:99%;
 font-size:98%;
}

#news {
 padding-left:2em;
}
#innews {
 padding-left:2em;
}
#stop {
 padding-left:2em;
}

/*-----------------------------------indexメイン真ん中の中身*/
.cm {
 margin:1px;
 padding:1px;
 text-align:center;
 font-size:small;
}

.cmtext {
 margin:3px;
 padding:3px;
 border: 4px solid #FF9999;
 font-size:90%;
 background-color:#FFFF99;
}

.cm60 {
 margin:0px 2px 4px 2px;
 padding:0px;
}

.cmhalf {
 float:left;
 margin:1px;
 padding:1px 3px 1px 2px;
}

.cm420 {
 text-align:center;
 margin:3px;
 padding:3px;
}

/* ▼表示領域が719px未満の場合*/
@media screen and (max-width: 719px) {
.cm img{
	max-width:100%;
    height:auto;
    vertical-align:bottom;
    text-align:center;
    }
.cmhalf {
	overflow: hidden;
	clear: both;
	position: relative;
	}
	
.cm60 img{
	max-width:100%;
    height:auto;
    vertical-align:bottom;
    text-align:center;
    }
    
.cm420 {
	max-width:100%;
	height:auto;
    vertical-align:bottom;
    text-align:center;
}
	
}

/*-----------------------------------indexメイン右の中身*/
.rs1{ margin:3px; }
.rs2{ margin:2px; }

.rsbox1 {
 background-color:#E9FFC8;
 border: 1px solid #4BC800;
 font-size:10pt;
 margin:2px 14px;
 padding:0.5em;
 width:136px;
}

.rsbox2 {
 border: 1px solid #4682b4;
 font-size:9pt;
 margin:1px 28px;
 padding:1px;
 width:120px;
}

.rsbox3 {
 border: 1px solid #4682b4;
 background-color:#99CCCC;
 font-size:10pt;
 margin:7px;
 padding:5px 1px;
}

@media screen and (max-width:719px){
.rs1{
 margin:0px;
 padding:0px
}
.rs2 { display:none; }
.rs001{	display:none; }
.rsbox2{ display:none; }

.rs002{
	width:100%;
	text-align:center;
	margin:1px;
}

.rsbox1 {
	padding:0.5em;
	width:110px;
}

}

/*-----------------------------------上へ戻るボタン*/
#fixedTop {
	background: #000;
	border-radius: 5px;
	bottom: -60px;
	color: #fff;
	font-size: 20px;
	right: 10px;
	width: 50px;
	height: 50px;
	line-height: 50px;
	position: fixed;
	text-align: center;
	z-index: 9999;
	-webkit-transform: translateZ(0);
}

#fixedTop:hover {
	opacity: 0.8;
	transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
}

/*-----------------------------------head-navi*/
#head-navi{
	color:maroon;
	font-size:12px;
	margin:0 0 0 2em;
}

#head-navi　a　{
	color:maroon;
}

.head-navi{
	color:maroon;
	font-size:12px;
	margin:0 0 0 2em;
}

.head-navi　a　{
	color:maroon;
}
@media screen and (max-width:719px) {
#head-navi{
	display:none;
	}
}

/*-----------------------------------2分割画面の左で利用*/
.stc1 {
	line-height:140%;
	margin:3px 3px 2em 0.5em;
}

.stc2 {
	font-size:15px;
	line-height:140%;
	margin:1em 8px 2em 1em;
}

.stc3 {
	margin:0.5em 1.2em;
	line-height:160%;
}

/*-----------------------------------アコーディオン navi3の補足*/
.navi3 dl {
	margin-bottom:8px;
	margin-left:5em;
	padding:0px 5px;
	width:80%;
}

.navi3 dt {
	border: 1px solid #004D99;
	font-weight: bold;
	margin:1px;
	padding:4px;
}

.navi3 dd {
	margin-left:1em;
	padding:1px;
	margin-top:0;
}

.navi3 ul {
	margin-top:1px;
	margin-left:1px;
	padding:5px;
}

.navi3 li {
	font-size:15px;
	line-height:130%;
	list-style-type:none;
	padding:2px;
}
/* ▼表示領域が719px未満の場合*/
@media screen and (max-width: 719px) {
.navi3 dl {
	margin:auto;
	width:90%;
}

}

/*-----------------------------------アコーディオン navi13の補足*/
.navi13 dl {
	margin:1px;
	padding:5px;
	width:95%;
}

.navi13 dt {
	margin:1px;
	padding:1px;
}

.navi13 dd {
	padding:1px;
}

.navi13 ul {
	margin-top:1px;
	padding:5px;
}

.navi13 li {
	font-size:15px;
	line-height:130%;
	list-style-type:none;
	padding:2px;
}
/* ▼表示領域が719px未満の場合*/
@media screen and (max-width: 719px) {
.navi13 dl {
	margin:auto;
	width:90%;
}

}

/*-----------------------------------アコーディオン navifmの補足*/
.navifm dl {
	font-size:15px;
	width:98%;
	margin-left:1px;
	background-color:#66cdaa;
	margin-top:1px;
}

.navifm dt {
	border: 1px solid #004D99;
	font-weight: bold;
	margin:1px;
	padding:4px;
}

.navifm dd {
	margin-left:1.2em;
	padding-left:5px;
}

.navifm ol {
	margin-top:1px;
	padding-left:1px;
}

.navifm li {
	margin-top:0.5em;
}
/*-----------------------------------下段　加入者サポート */
.us-bana {
	background-color:#ffe4e1;
	padding:2px 1px;
}

.us-tbl{
	clear:both;
	margin:1em 0px 0px 1.5em;
	text-align:center;
	padding:2px;
	width:980px;
}

.us-bana img{
	vertical-align: middle;
	margin:2px;
}

@media screen and (max-width:719px){
 .us-tbl {
   width:90%;
   margin:auto;
   text-align:center;
   clear:both;
   vertical-align: middle;
   }
   
}

/*-----------------------------------枠囲み　 */
.box-fdblue {
	background:#D3EDFB;
	border-bottom:#D9D9D9 solid 1px;
	border-radius:7px;
	margin:3px 2em;
	padding:6px;
	font-size:80%;
	line-height:110%;
}

.box-yllw {
	background:#FFFFEC;
	border-bottom:#D9D9D9 solid 1px;
	border-radius:7px;
	margin-bottom:1em;
	padding:20px;
}

.box-yllw2 {
	text-align:center;
	background:#FFEE75;
	border-bottom:#D9D9D9 solid 1px;
	border-radius:6px;
	margin:1em;
	padding:0.5em;
}

.box-white {
	background:#FFF;
	border-radius:7px;
	margin-bottom:1em;
	padding:10px;
}

.box-pink {
	background:#ffb6c1;
	border-radius:7px;
	border-bottom:#D9D9D9 solid 2px;
	font-weight:bold;
	margin:3em;
	padding:2em 0.5em;
}

.box-pink2 {
	background:#ffb6c1;
	border-radius:7px;
	border-bottom:#D9D9D9 solid 2px;
	font-weight:bold;
	margin:1em;
	padding:0.5em;
	text-align:center;
}

.box-sprt1 {
	background:#FFAE35;
	border-radius:10px;
	border-bottom:#D9D9D9 solid 2px;
	margin:1.5em;
	padding:1em;
	line-height:200%;
}

.box-pl_siro {
	background:#FFF;
	border:#d4dcda solid 2px;
	border-radius:7px;
	margin-bottom:1em;
	margin-top:3em;
	padding:0px 5px;
}

.box-cl {
	border:#d4dcda solid 2px;
	border-radius:7px;
	padding:0px;
	width:50%;
	margin:auto;
}
.box-cl li{
	line-height:120%;
}

.box-fm_apl {
	border:#d4dcda solid 2px;
	border-radius:7px;
	margin-left:2em;
	padding:1em;
	width:600px;
	text-align:center;
}

.return{
  padding: 0;
  margin:0;
}

#rs-boxyoutube {
 color:white;
 border: 2px solid #000080;
 border-radius: 5px;
 font-size:95%;
 margin:5px 2em;
 padding:1em 0.2em;
 background-color:red;
 line-height:100%;
 }

#rs-boxyoutube　a:link { text-decoration:none; color:white;}
#rs-boxyoutube a:visited { text-decoration:none; color:white;}
#rs-boxyoutube a:active { text-decoration:none; color:red;}
#rs-boxyoutube a:hover { text-decoration:underline; color:red; background-color:pink;}

#esports {
 color:white;
 border: 5px solid #deb887;
 border-radius: 5px;
 font-size:95%;
 margin:5px 2em;
 padding:1em 0.2em;
 background-color:#4169e1;
 line-height:100%;
 }


/* ▼表示領域が719px未満の場合*/
@media screen and (max-width: 719px) {
.box-cl {
	text-align:left;
	width:70%;
}
.box-cl ul{
	margin:5px;
}
.box-fm_apl {
	margin:auto;
	padding:0.5em;
	width:95%;
}

}/* ▲表示領域が719px未満の場合*/

img[usemap] {
    max-width: 100%;
    height: auto;
}


/* ▼バナーマウスオーバーで拡大　2024.2.16　*/
.item-wapper img:hover {
transform: scale( 1.3, 1.3 );/* 画像が縦横1.3倍 */
transition-duration: 0.5s;/* 表示を0.5秒かけて行う */
}
.item-wapper img{
transition-duration: 0.5s;/* 表示を0.5秒かけて行う */
}