@charset "utf-8";
/* ---------------------------------------------------
 Layout-pc-s
--------------------------------------------------- */
@media only screen and (min-width:960px) and (max-width:1279px){


  	/*--------------------------------------------------------
  	  INFORMATION
  	--------------------------------------------------------*/
  	#info_area{
  		width: 100%;
  		background: #000;
  		padding-bottom: 60px;
  	}
  	.info_ttl{
  		font-size: 4.5vw;
  	  font-family: "Roboto Condensed", sans-serif;
  		text-align: center;
  		color: #fff;
  		font-weight: bold;
  		padding-top: 40px;
  	}
  	.info_ttl_s{
  		font-size: 2.4vw;
  	  font-family: "Roboto Condensed", sans-serif;
  		font-weight: bold;
  		text-align: center;
  		color: #000;
  		background: #b30000;
  		padding-top: 10px;
  		padding-bottom: 8px;
  		width: 26vw;
  		margin: 5px auto;
  	}
  	/*コンテナ*/
  	.info_container{
  		max-width: 90%;
  		margin: 30px auto;

  		display: -webkit-box;
  		display: -ms-flexbox;
  		display: flex;
  		-ms-flex-wrap: wrap;
  		flex-wrap: wrap;
  		justify-content: center;
  	}
  	.info_item{
  		width: 25%;
  		border: solid 1px #fff;
  		font-family: "Roboto Condensed", sans-serif;
  		font-weight: bold;
  		letter-spacing: 0.01em;
  	}
  	.info_logo{
  		width: 85%;
  		margin: 0 auto;
  	}
  	.info_date{
  		font-size: 2vw;
  		text-align: center;
  	}
  	.info_btn{
  		font-size: 2vw;
  		text-align: center;
  		background: #b30000;
  		padding: 5px;
  		width: 80%;
  		margin: 20px auto 40px;
  	}


    /*--------------------------------------------------------
    about
    --------------------------------------------------------*/
    #about_area{
    	width: 100%;
    	position: relative;
    	height: 700px;
    }
    .about_bg{
    	display: block;
    	position: absolute;
    	z-index: -100;
    	width: 100%;
    }
    .about_bg img{
    	object-fit: cover;
    	height: 700px;
    	width: 100%;
    }
    .about_bg-sp{
    	display: none;
    }
    .about_txt{
    	position: absolute;
    	right: 5%;
    	top: 14vh;
      font-family: "Cormorant Garamond", serif;
    	font-weight: 700;
    }
    .about_headline{
    	font-family: "Cormorant Garamond", serif;
    	font-weight: 700;
    	color: #674594;
    	font-size: 40px;
    	margin-top: 20px;
    }
    .about_body{
    	color: #333;
    	font-size: 18px;
    	line-height: 1.5em;
    	margin-top: 20px;
      font-weight: 700;
    }
    	/*--------------------------------------------------------
    	about-2
    	--------------------------------------------------------*/
    	#about2_area{
    	}
    	.sec_about2{
    		width: 100%;
    	}
    	/* -- 背景固定 --*/
    	/*-- 親 --*/
    	.fix-block{
    	   position: relative;
         height: 960px;
    	}
    	/*-- 画像 --*/
    	.inner{
    	   position: absolute;
    	   top: 0;
    	   left: 0;
    	   width: 100%;
    	   height: 100%;
    	   clip-path: inset(0);
    		 z-index: -100;
    	}
    	.bg{
    	   position: fixed;
    	   top: 0;
    	   left: 0;
    	   width: 100vw;
    	   height: 110vh;
    	   background-image: url("../images/about2-bg.jpg");
    	   background-size: cover;
    	   background-position: center;
    	   z-index: -1;
    	}
    	/*-- コンテンツ --*/
    	.contents{
    		width: 100%;
    		position: absolute;
    		z-index: 10;
    		top: 100px;
    		left: 50%;
    		transform: translateX(-50%);
    		-webkit-transform: translateX(-50%);
    		-ms-transform: translateX(-50%);
    		z-index: -50;
    	}

    	.container{
    		width: 100%;
    		display: -webkit-box;
    	  display: -ms-flexbox;
    	  display: flex;
    	  -ms-flex-wrap: wrap;
    	  flex-wrap: wrap;
    	  justify-content: space-between;
    	  margin: 0 auto;
    	}
    	.about2-pic{
    		width: 44%;
    	}
      .about2-txt{
      	width: 45%;
      	margin-right: 6%;
      	margin-left: 4%;

      	font-size: 18px;
      	line-height: 1.5em;
      	margin-top: 10px;
      	font-family: "Cormorant Garamond", serif;
      	font-weight: 700;
      	text-align: right;
      }
      .about2-headline{
      	font-family: "Cormorant Garamond", serif;
      	font-weight: 700;
      	font-size: 40px;
      	margin-bottom: 40px;
      	margin-top: 20px;
      	line-height: 1.5em;
      }

    	.about2-bottom{
    		width: 100%;
    		display: -webkit-box;
    		display: -ms-flexbox;
    		display: flex;
    		-ms-flex-wrap: wrap;
    		flex-wrap: wrap;
    		justify-content: right;
    		margin: 0 auto;
    	}
    	.about2-bottom-img{
    		width: 30%;
    		margin-top: 100px;
    	}


      	/*--------------------------------------------------------
      	CHARACTER
      	--------------------------------------------------------*/
      	#char_area{
      	}
      	.sec_about2{
      		width: 100%;
      	}
      	/* -- 背景固定 --*/
      	/*-- 親 --*/
      	.fix-block-char{
      	   position: relative;
      	   height: 960px;
      	}
      	/*-- 画像 --*/
      	.inner{
      	   position: absolute;
      	   top: 0;
      	   left: 0;
      	   width: 100%;
      	   height: 100%;
      	   clip-path: inset(0);
      		 z-index: -100;
      	}
      	.char_bg{
      	   position: fixed;
      	   top: 0;
      	   left: 0;
      	   width: 100vw;
      	   height: 120vh;
      	   background-image: url("../images/char-bg.jpg");
      	   background-size: cover;
      	   background-position: center;
      	   z-index: -1;
      	}
      	/*-- コンテンツ --*/
      	.contents{
      		width: 100%;
      		position: absolute;
      		z-index: 10;
      		top: 100px;
      		left: 50%;
      		transform: translateX(-50%);
      		-webkit-transform: translateX(-50%);
      		-ms-transform: translateX(-50%);
      		z-index: -50;
      	}

      	.char_container{
      		width: 90%;
      		display: -webkit-box;
      	  display: -ms-flexbox;
      	  display: flex;
      	  -ms-flex-wrap: wrap;
      	  flex-wrap: wrap;
      	  justify-content: center;
      	  margin: 0 auto;
      	}
      	.char_pic{
      		width: 40%;
      	}
      	.char_txt{
      		width: 50%;
      		margin-right: 6%;
      		margin-left: 4%;
      		font-size: 18px;
      		line-height: 1.5em;
      		margin-top: 0px;
          font-family: "Cormorant Garamond", serif;
        	font-weight: 700;
      			text-align: justify;
      	}
      	.char_pic-2{
      		width: 40%;
      	}
      	.char_txt-2{
      		width: 50%;
      		margin-right: 6%;
      		margin-left: 4%;

      		font-size: 18px;
      		line-height: 1.5em;
      		margin-top: 0px;
          font-family: "Cormorant Garamond", serif;
        	font-weight: 700;
      		text-align: justify;
      	}
      	.char_headline{
      		font-size: 40px;
      		margin-bottom: 20px;
      		margin-top: 40px;
      		font-weight: 700;
      	}
      	.hr-char{
      		width: 90%;
      		height: 1px;
      		background-color: #fff;
      		border: none;
      		color: #fff;
      		margin: 60px auto;
      	}


        	/*--------------------------------------------------------
        	location
        	--------------------------------------------------------*/

        	.location_1{
        		height: 400px;
        		position: relative;
        		width: 100%;
        	}
        	.location_bg{
        		width: 100%;
        		position: absolute;
        		z-index: -100;
        		height: 400px;
        		background: rgb(11,6,96);
        		background: linear-gradient(90deg, rgba(11,6,96,1) 10%, rgba(0,0,0,1) 50%, rgba(11,6,96,1) 90%);
        	}
        	.location_1_pic{
        		position: absolute;
        		left: 0%;
        		width: 60%;
        		display: -webkit-box;
        		display: -ms-flexbox;
        		display: flex;
        		-ms-flex-wrap: wrap;
        		flex-wrap: wrap;
        		justify-content: left;
        		margin: 40px auto;
        		z-index: -50;
        	}
        	.location_1_pic img{
        		width: 100%;
        		object-fit: cover;
        	}

        	.location_1_number{
        		position: absolute;
        		z-index: -50;
        		right: 3%;
        		top: 80px;

        		font-size: 30px;
        		font-weight: 500;

        		width: 25%;
        		color: #1E1E66;
        		text-align: center;

        		line-height: 1.5em;

        		font-family: "Special Elite", system-ui;
        		font-weight: 400;
        		font-style: normal;
        	}
        	.location_1_number-l{
        		font-size: 160px;
        		font-weight: 500;
        		margin-top: 60px;
        	}
        	.location_1_txt{
        		position: absolute;
        		z-index: -40;
        		right: 20%;
        		top: 140px;

        		font-size: 40px;

        		width: 20%;
        		color: #fff;
        		text-align: center;
            font-family: "Cormorant Garamond", serif;
          	font-weight: 700;
        		font-style: normal;
        		line-height: 1.2em;
        		border-bottom: solid 1px #fff;
        		text-shadow: 3px 3px 3px #333;
        	}

        	/*2*/
        	.location_2_pic{
        		position: absolute;
        		right: 0%;
        		width: 60%;
        		display: -webkit-box;
        		display: -ms-flexbox;
        		display: flex;
        		-ms-flex-wrap: wrap;
        		flex-wrap: wrap;
        		justify-content: right;
        		margin: 40px auto;
        		z-index: -50;
        	}
        	.location_2_pic img{
        		width: 100%;
        		object-fit: cover;
        	}

        	.location_2_number{
        		position: absolute;
        		z-index: -50;
        		left: 5%;
        		top: 80px;

        		font-size: 32px;
        		font-weight: 500;

        		width: 20%;
        		color: #1E1E66;
        		text-align: center;

        		line-height: 1.5em;

        		font-family: "Special Elite", system-ui;
        		font-weight: 400;
        		font-style: normal;
        	}
        	.location_2_number-l{
        		font-size: 160px;
        		font-weight: 500;
        		margin-top: 60px;
        	}
        	.location_2_txt{
        		position: absolute;
        		z-index: -40;
        		left: 20%;
        		top: 140px;

        		font-size: 40px;
        		font-weight: 700;

        		width: 30%;
        		color: #fff;
        		text-align: left;
        		font-family:'Cormorant Garamond', serif;
        		line-height: 1.2em;
        		border-bottom: solid 1px #fff;
        		text-shadow: 3px 3px 3px #333;
        	}

        	.location_3{
        		height: 400px;
        		position: relative;
        		width: 100%;
        		margin-bottom: 60px;
        	}


          	/*--------------------------------------------------------
          	game play
          	--------------------------------------------------------*/

          	.gameplay-1{
          		width: 100%;
          		background: url("../images/play-bg.jpg") no-repeat 0 0 / cover;
          	}
          	.gameplay-2{
          		width: 100%;
          		background: url("../images/play-bg2.jpg") no-repeat 0 0 / cover;
          	}

          	.gameplay_container{
          		width: 90%;
          		display: -webkit-box;
          		display: -ms-flexbox;
          		display: flex;
          		-ms-flex-wrap: wrap;
          		flex-wrap: wrap;
          		justify-content: center;
          		margin: 60px auto 0;
          		padding-bottom: 60px;
          	}

            .gameplay_txt{
            	width: 600px;
            	font-family: "Cormorant Garamond", serif;
            	font-weight: 700;
            	font-style: normal;
            	font-size: 46px;
            }
            .gameplay_body{
            	font-size: 18px;
            	line-height: 1.5em;
            	margin-top: 40px;
            	font-family: "Cormorant Garamond", serif;
            	font-weight: 700;
            }
          	.gameplay_graph{
          			width: 36%;
          	}
          	.gameplay_container2{
          		width: 90%;
          		display: -webkit-box;
          		display: -ms-flexbox;
          		display: flex;
          		-ms-flex-wrap: wrap;
          		flex-wrap: wrap;
          		justify-content: center;
          		margin: 0px auto 0;
          		padding-top: 80px;
          		padding-bottom: 60px;
          	}

            .gameplay_txt2{
            	width: 600px;
            	font-family: "Cormorant Garamond", serif;
            	font-weight: 700;
            	font-style: normal;
            	font-size: 46px;
            	text-align: right;
            }
            .gameplay_body2{
            	font-family: "Cormorant Garamond", serif;
            	font-weight: 700;
            	font-size: 18px;
            	line-height: 1.5em;
            	margin-top: 30px;
            	text-align: right;
            }
          	.gameplay_graph2{
          			width: 36%;
          	}

            .footer_nav li{
          		font-size: 16PX;
          		margin: 0 15px 0 15px;
          	 line-height: 2.5em;
          	 font-weight: bold;
          	 line-height: 2.2em;
          	 letter-spacing: 0.05em;
          	 	font-family:'Special Elite', sans-serif;
          	}

          }