@charset "utf-8";

        /* http://meyerweb.com/eric/tools/css/reset/ 
           v2.0 | 20110126
           License: none (public domain)
        */

        html, body, div, span, applet, object, iframe,
        h1, h2, h3, h4, h5, h6, p, blockquote, pre,
        a, abbr, acronym, address, big, cite, code,
        del, dfn, em, img, ins, kbd, q, s, samp,
        small, strike, strong, sub, sup, tt, var,
        b, u, i, center,
        dl, dt, dd, ol, ul, li,
        fieldset, form, label, legend,
        table, caption, tbody, tfoot, thead, tr, th, td,
        article, aside, canvas, details, embed, 
        figure, figcaption, footer, header, hgroup, 
        menu, nav, output, ruby, section, summary,
        time, mark, audio, video {
            margin: 0;
            padding: 0;
            border: 0;
            font-size: 100%;
            font: inherit;
            vertical-align: baseline;
        }
        /* HTML5 display-role reset for older browsers */
        article, aside, details, figcaption, figure,
        footer, header, hgroup, menu, nav, section {
            display: block;
        }
        body {
            line-height: 1.2;
            font-size:0.875rem;
            color:#fff;
            background:#ff9f40;
        }
        

html { scroll-behavior: smooth;}

small{
font-size: 0.8em;}

p.maru {
font-family: "M PLUS Rounded 1c";
font-weight: bold;}

p.maru2 {
font-family: "M PLUS Rounded 1c";
font-weight: bold;
font-size: 16px;
margin: 0px -6px 5px;}


/*========= ナビゲーションのためのCSS ===============*/

#g-nav{
    /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
    position:fixed;
    z-index: 999;
    /*ナビのスタート位置と形状*/
	top:0;
    right: -120%;
	width:300px;
    height: 100vh;/*ナビの高さ*/
	background:rgba( 51, 40, 40, 0.9);
    /*動き*/
	transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive{
    right: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list{
    /*ナビの数が増えた場合縦スクロール*/
    position: fixed;
    z-index: 999; 
    width: 100%;
    height: 100vh;/*表示する高さ*/
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/



#g-nav ul {
    /*ナビゲーション天地中央揃え*/
    position: absolute;
    z-index: 999;
    top:20%;
}

/*リストのレイアウト設定*/

#g-nav li{
	list-style: none;
    text-align: right;
}

#g-nav li a{
	color: #fff;
	font-family: "M PLUS Rounded 1c";
	text-decoration: none;
	padding:10px;
	display: block;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-weight: bold;
}

/*========= ボタンのためのCSS ===============*/
.openbtn{
	position:fixed;
	background:rgba( 59, 39, 39, 0.5);
	border-radius: 10px;
    z-index: 9999;/*ボタンを最前面に*/
	top:10px;
	right: 10px;
	cursor: pointer;
    width: 50px;
    height:50px;
}
	
/*×に変化*/	
.openbtn span{
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 14px;
    height: 3px;
    border-radius: 2px;
	background-color: #fff;
  	width: 45%;
  }

.openbtn span:nth-of-type(1) {
	top:15px;	
}

.openbtn span:nth-of-type(2) {
	top:23px;
}

.openbtn span:nth-of-type(3) {
	top:31px;
}

.openbtn.active span:nth-of-type(1) {
    top: 18px;
    left: 18px;
    transform: translateY(6px) rotate(-45deg);
    width: 30%;
}

.openbtn.active span:nth-of-type(2) {
	opacity: 0;
}

.openbtn.active span:nth-of-type(3){
    top: 30px;
    left: 18px;
    transform: translateY(-6px) rotate(45deg);
    width: 30%;
}




        .p {
            word-break: break-word;
        }
        
        
        .toumei {
	opacity:0;
}
        section {
display: flex;
}

.bg {
position: fixed;
top: 0;
left: 0;
right: 0;
width: 100%;
height: 100%;
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
opacity: 0;
transition: all 0.5s ease 0s;
z-index: -1;
}
.show .bg {
opacity: 1;
}
.bg._01 {
background-image: url("https://nkmn.chips.jp/gm/trpg/22_11yuukoya/img/bg1.png");
}
.bg._02 {
background-image: url("https://nkmn.chips.jp/gm/trpg/22_11yuukoya/img/bg2.png");
}
.bg._r01 {
background-image: url("./yrg_im/r01.jpg");
}
.bg._r02 {
background-image: url("./yrg_im/r02.jpg");
}
.bg._r03 {
background-image: url("./yrg_im/r03.jpg");
}
.bg._r04 {
background-image: url("./yrg_im/r04.jpg");
}
.bg._20 	
{background-image:
		repeating-linear-gradient( 0deg, rgba( 255, 144, 84, .5) 0px 16px,	transparent 16px 32px),
		repeating-linear-gradient( 90deg, rgba( 255, 195, 84, .5) 0px 16px,	transparent 16px 32px);
        }
.bg._30 	
{background-image:
background-size: auto auto;
background-color: rgba(255, 167, 33, 0.86);
background-image: repeating-linear-gradient(45deg, transparent, transparent 16px, rgba(255, 122, 21, 0.45) 16px, rgba(255, 122, 21, 0.45) 20px );
        }
        
.onebox {
max-width: 400px;
margin: 0 auto;
padding: 20px;
background: #ffffff;
}
.onebox img {
width: 100%;
height: auto;
vertical-align: top;
margin-bottom: 15px;
}
.onebox p {
text-align: center;
margin: 0;
}

        
.background {width: 100%;
            background-size: cover;
            height: 100%;
            position: fixed;
            background-color: #38323c;
            background-image: url(./yrg_im/bg2.png);}

.hr1 {
	border-width: 2px 0 0 0;
	border-style: dashed;
	border-color: rgba( 240, 238, 235, 0.5);
}
        ol, ul {
            list-style: none;
        }
        blockquote, q {
            quotes: none;
        }
        blockquote:before, blockquote:after,
        q:before, q:after {
            content: '';
            content: none;
        }
        table {
            border-collapse: collapse;
            border-spacing: 0;
        }

        .system {
            color: #999;
            padding: 5px;
            margin-bottom:15px;
            background-color: rgba(28, 6, 0, 0.6);
        }

        .system + .system {
            margin-bottom:15px;
        }

        .body {
            background:rgba(28, 23, 33, 0.77);
            max-width:700px;
            border-radius: 10px;
            margin:auto;
            padding:15px;
            box-sizing:border-box;
            position: relative;
        }

        .main {
            display: flex;
        }

        .main:not(:last-child) {
            margin-bottom:15px;
        }

        .ic {
            margin-right: 18px;
        }

        .ic img {
            max-width:100px;
        }

        body {
           font-family: Verdana, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
        }


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

        b {
            font-weight:bold;
        }

        .index {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }

        .index .body {
            min-width: 70vw;
            width:100%;
            text-align: center;
            padding:40px 15px;
        }

        .list_link {
            color:#fff;
            font-size:16px;
            padding:10px 10px 15px;
            background:#000;
            margin:0 2px;
            display: block;
        }

        .index_h1 {
            font-size: 20px;
            margin-bottom: 10px;
        }

        .index_h2 {
            font-size:18px;
            margin-bottom:5px;
        }

        .list + .index_h2 {
            margin-top:20px;
        }

        .list {
            display: flex;
            justify-content: center;
        }
        .fail{
            color: #F50057;
            }
        .success{
            color: #258bdd;
            }

        .gm {
            color: #8a867c;
            }
            
        .nkmn {
            color: #68b9d4;
        }
      
      
#header{
  width:100%;
  background:rgba( 59, 39, 39, 0.9);
  padding: 20px 0;
  margin: 0 auto 1em;
}

#footer{
  background:rgba( 59, 39, 39, 0.9);
  text-align: right;
  padding:10px;
  margin: 1em auto 0;
}

/* カーソルを重ねる要素 */
.tooltip {
  border-bottom:dashed 1px #9c141f;
  position: relative; /* ツールチップの位置の基準に */
  cursor: pointer; /* カーソルを当てたときにポインターに */
}

/* ツールチップのテキスト */
.tooltip-text {
  opacity: 0; /* はじめは隠しておく */
  visibility: hidden; /* はじめは隠しておく */
  position: absolute; /* 絶対配置 */
  left: -80px; /* 親に対して中央配置 */
  transform: translateX(0%); /* 親に対して中央配置 */
  bottom: 0px; /* 親要素下からの位置 */
  display: inline-block;
  padding: 5px; /* 余白 */
  white-space: nowrap; /* テキストを折り返さない */
  font-size: 0.6rem; /* フォントサイズ */
  line-height: 1.3; /* 行間 */
  background: #333; /* 背景色 */
  color: #fff; /* 文字色 */
  border-radius: 3px; /* 角丸 */
  transition: 0.3s ease-in; /* アニメーション */
}

/* ホバー時にツールチップの非表示を解除 */
.tooltip:hover .tooltip-text {
  opacity: 1;
  visibility: visible;
}


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

        }

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


        }