@charset "utf-8";
/* CSS Document */

body {
	background-image: url("../images/back.png");
    background-repeat: repeat-y;
	width: 100vw;
    height: auto;
}

a {
	text-decoration: none !important;
}

a:hover a:active{
    opacity: 0.8;
}
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}


.AR_list ul{
	padding: 0;
}

.AR_list li{
	list-style: none;
	/*border-bottom:solid 1px #FFF;*/
}





.head{
	position: absolute;
  z-index: 1;
	}

.icon_text{
	position: absolute;
  z-index: 2;
	}


.prev{
	position: absolute;
  z-index: 2;
	}

.next{
	position: absolute;
  z-index: 2;
	}

.ie-edge{
    display: none; 
}

/* IE11 */
_:-ms-lang(x)::-ms-backdrop, .ie-edge {
    display:block !important;
}
/* IE11 */
_:-ms-lang(x)::-ms-backdrop, .ie-edge img{
    width: 100%;
}
/* IE11 */
_:-ms-lang(x)::-ms-backdrop, .prev,.next,.head p{
    display: none !important;
}

/* Edge */
_:-ms-lang(x)::backdrop, .ie-edge {
    display:block !important;
}
/* Edge */
_:-ms-lang(x)::backdrop, .ie-edge img{
    width: 100%;
}
/* Edge */
_:-ms-lang(x)::backdrop, .prev,.next,.head p{
    display: none !important;
}

@media only screen and (min-width:793px) {
	/*画面幅が793px以上の時*/
.sp { display: none !important; }
/*.pc { display: block !important; }*/
}

@media screen and (max-width:793px){
  /*画面幅が793pxまでの時*/
	
	.AR_body{
		width: 100VW;
	}
	
	.section_title{
		color: #FFF;
		font-size: 3.5vw;
		font-weight: bold;
		padding-left: 2vw;
		padding-top:2vw;
	}

	.head{
	top:2vh;
	padding: 2vh;
	}
	
	.head img {width: 80vw;
	}
	
	.head p {
		color: #FFF;
		font-size: 5vw;
		font-weight: bold;
		padding-top: 2vh;
	}
	
	.head_top{
	top:1vh;
	padding-top: 5vw;
	margin-bottom:5vw;
	float:left;
	width: 90vw;
	
	}
	
	.head_top img {
	width: 65vw;
	
	}
	
	.head_top p {
		color: #FFF;
		font-size: 7vw;
		font-weight: bold;
		padding-top: 1vw;
	}
	
	.head_menu {
		width: 80vw;
		margin:0 auto;
		padding-top:30px;
		color:#FFF;
	}
	
	.head_menu li{
		max-width:80vw;
		font-size:4vw ;
		padding-top:0;
		margin-bottom:10px;
		padding-bottom:10px;
		font-weight:bold;
		border-bottom: solid 1px #FFF;
		
		
	}
    /*.AR_list img{
	width: 100%;
}*/
    
	.AR_list {
	width: 90vw;
	margin: 0 auto;
	margin-top: 0vw;
	
}

    .AR_list ul{
	padding: 0;
    margin: 0 auto;
    
}

	.AR_list li{
	width: 90vw;
	float:left;
	margin-bottom:10px;
}

    .AR_list_A{
        width: 90vw;
        float: left;
    }

    .AR_list_B{
        width: 45vw;
        float: left;
	 }
	
	.AR_list_C{
        width: 45vw;
		
    }
    
   	
/*ここから既存のモノ*/   

	
	.icon_text{
	top:66.5vh;
	left:32vw;
	}
	
	.icon_text img {width: 50vw;
	}
	
	.bottom_area{
		width: 94vw;
		margin: 0 auto;
	}
	
	.btn_a img{
		width: 40vw;
		
	}
	
	.btn_a {
		margin:5vw 3vw;
		float: left;
	}
    
    
    .option{
        
        margin: 0 auto;
        width: 80%;
        position: absolute;
    z-index: 2;
        left: 10%;
    }
    
    
    .prev{
	top: 57vh;
    width: 45vw;
    left: 5vw;
	}
    
    .prev p{
        float: left;
        font-size: 2.5vw;
        font-weight: bold;
        color: #FFF;
    }
	
	.prev_img {
        width: 5vw;
        float: left;
        padding-top: 3vw;
	}
    
    .prev img {
        width: 4vw;
        transform: rotate( -90deg );  /* 2D(平面)で回転 */
    }
    
    .next{
        top: 57vh;
    width: 45vw;
    left: 50vw;
	}
    
    .next p{
        float: right;
        font-size: 2.5vw;
        font-weight: bold;
        color: #FFF;
    }
	
	.next_img {
        width: 5vw;
        float: right;
        padding-top: 3vw;
	}
    
    .next img {
        float: right;
        width: 4vw;
        transform: rotate( -90deg );  /* 2D(平面)で回転 */
    }
	
}
@media screen and (min-width:500px){
  /*画面幅が500px以上の時*/
	
	.AR_body{
		width: 100VW;
	}
	
	.section_title{
		color: #FFF;
		font-size: 1.75vw;
		font-weight: bold;
		padding-left: 1vh;
		padding-top:2vw;
	}
	
	
	.head_top{
	top:1vh;
	padding-top: 20px;
	padding-left: 2vh;
	float:left;
	width: 31.5vw;
	
	}
	
	.head_top img {width: 30vw;
	}
	
	.head_top p {
		color: #FFF;
		font-size: 2vw;
		font-weight: bold;
		padding-top: 1vw;
	}
	
	.head_menu {
		width: 25vw;
		float:right;
		padding-top:5px;
		color:#FFF;
		padding-right:2vh;
	}
	
	.head_menu li{
		max-width:25vw;
		font-size: 1.3vw;
		padding-top:0;
		padding-bottom:10px;
		argin-bottom:10px;
		font-weight:bold;
		border-bottom: solid 1px #FFF;
		
		
	}
    /*.AR_list img{
	width: 100%;
}*/
    
	.AR_list {
	width: 90vw;
	margin: 0 auto;
	margin-top: 0vw;
	margin-bottom:30px;
}

    .AR_list ul{
	padding: 0;
    margin: 0 auto;
    
}

	.AR_list li{
	width: 44vw;
	float:left;
	margin: 0.5vw 0.5vw 0.5vw 0.5vw;
}
	
    .AR_list_A{
        width: 44vw;
        float: left;
    }

    .AR_list_B{
        width: 22vw;
        float: left;
	 }
	
	.AR_list_C{
        width: 22vw;
		
    }
    
   
    
	.head{
	top:1vh;
	padding: 2vh;
	}
	
	.head img {width: 30vw;
	}
	
	.head p {
		color: #FFF;
		font-size: 3vw;
		font-weight: bold;
		padding-top: 1vw;
	}
	
	
    
    .prev_img {
        width: 5vw;
        float: left;
        padding-top: 2vw;
	}
    
	.next_img {
        width: 5vw;
        float: right;
        padding-top: 2vw;
	}
    
    .icon_text{
	top:68vh;
	left:63vw;
	}
	
	.icon_text img {width: 30vw;
	}
    
    .icon_text img {
        width: 210px;
        height: 50px;
        object-fit: cover;
        object-position: 0 100%;
	}
    
    
}

@media screen and (min-width:793px){
  /*画面幅が793px以上の時*/

	.AR_body{
		width: 100VW;
	}
	
	.section_title{
		color: #FFF;
		font-size: 1.75vw;
		font-weight: bold;
		padding-left: 1vh;
		padding-top:2vw;
	}
	
	
	.head_top{
	top:1vh;
	padding-top: 20px;
	padding-left: 2vh;
	float:left;
	width: 31.5vw;
	
	}
	
	.head_top img {width: 30vw;
	}
	
	.head_top p {
		color: #FFF;
		font-size: 2vw;
		font-weight: bold;
		padding-top: 1vw;
	}
	
	.head_menu {
		width: 25vw;
		float:right;
		padding-top:5px;
		color:#FFF;
		padding-right:2vh;
	}
	
	.head_menu li{
		max-width:25vw;
		font-size: 1.3vw;
		padding-top:0;
		padding-bottom:10px;
		argin-bottom:10px;
		font-weight:bold;
		border-bottom: solid 1px #FFF;
		
		
	}
    /*.AR_list img{
	width: 100%;
}*/
    
	.AR_list {
	width: 65vw;
	margin: 0 auto;
	margin-top: 0vw;
	margin-bottom:30px;
}

    .AR_list ul{
	padding: 0;
    margin: 0 auto;
    
}

	.AR_list li{
	width: 31.5vw;
	float:left;
	margin: 0.5vw 0.5vw 0.5vw 0.5vw;
}
	
    .AR_list_A{
        width: 31.5vw;
        float: left;
    }

    .AR_list_B{
        width: 15.75vw;
        float: left;
	 }
	
	.AR_list_C{
        width: 15.75vw;
		
    }
    
    
    
    
    .bottom_area{
		width: 73vw;
		margin: 0 auto;
	}
	
	.btn_a img{
		width: 30vw;
		
	}

	.btn_a {
		margin:5vw 3vw;
		float: left;
	}
    
    
    
    .prev{
	top: 57vh;
    width: 45vw;
    left: 5vw;
	}
    
    .prev p{
        float: left;
        font-size: 2vw;
        font-weight: bold;
        color: #FFF;
    }
	
	.prev_img {
        width: 4vw;
        float: left;
        padding-top: 1.5vw;
	}
    
    .prev img {
        width: 3vw;
        transform: rotate( -90deg );  /* 2D(平面)で回転 */
    }
    
    .next{
        top: 57vh;
    width: 45vw;
    left: 50vw;
	}
    
    .next p{
        float: right;
        font-size: 2vw;
        font-weight: bold;
        color: #FFF;
    }
	
	.next_img {
        width: 4vw;
        float: right;
        padding-top: 1.5vw;
	}
    
    .next img {
        float: right;
        width: 3vw;
        transform: rotate( -90deg );  /* 2D(平面)で回転 */
    }
    
    
}

@media screen and (min-width:1540px){
  /*画面幅が1540px以上の時*/
	

    .AR_body{
		width: 100VW;
	}
	
	.section_title{
		color: #FFF;
		font-size: 1.2vw;
		font-weight: bold;
		padding-left: 2vh;
		padding-top:2vw;
	}
	
	.head_top{
	top:1vh;
	padding-top: 20px;
	padding-left: 2vh;
	float:left;
	width: 31.5vw;
	
	}
	
	.head_top img {width: 30vw;
	}
	
	.head_top p {
		color: #FFF;
		font-size: 2vw;
		font-weight: bold;
		padding-top: 1vw;
	}
	
	.head_menu {
		width: 25vw;
		float:right;
		padding-top:5px;
		color:#FFF;
		padding-right:2vh;
	}
	
	.head_menu li{
		max-width:25vw;
		font-size: 1vw;
		padding-top:0;
		
		margin-bottom:0.5vw;
		font-weight:bold;
		border-bottom: solid 1px #FFF;
		
		
	}
    /*.AR_list img{
	width: 100%;
}*/
    
	.AR_list {
	width: 65vw;
	margin: 0 auto;
	margin-bottom:50px
}

	.AR_list li{
	width: 31.5vw;
	margin: 0 auto;
	margin: 0.5vw;
}

    .AR_list ul{
	padding: 0;
    margin: 0 auto;
    margin-top: 0vw;
	
}
	
    .AR_list_A{
        width: 31.5vw;
        float: left;
        
		
    }
	
    .AR_list_B{
        width: 15.75vw;
        float: left;
       
		
    }
    
	.AR_list_C{
        width: 15.75vw;
        float: left;
        
		
    }
    
    
    .prev_img {
        width: 4vw;
        float: left;
        padding-top: 1vw;
	}
    
	
	.next_img {
        width: 4vw;
        float: right;
        padding-top: 1vw;
	}
	
	
    
}