@charset "UTF-8";



/*共通
---------------------------------------------------------*/
.com_title{
	position: relative;
	border-top:4px solid #ccb200;
	border-bottom:4px solid #ccb200;
	padding: 3px 0 7px 0;
	margin-bottom: 80px;
}
.com_title::before{
	display: block;
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	-webkit-transform: translateY(-70%);
	transform: translateY(-70%);
	margin: 0 auto;
	max-width: 230px;
	height: 65px;
	width: 300px;
	background:url("../images/com_title_kazari.png") repeat-x center bottom;
	background-size:100% auto;}
.com_title dl{
	border-top:1px solid #ccb200;
	background:url("../images/com_title_dot.png") repeat-x center bottom;
	background-size:7px 4px;
	padding: 20px 0 15px 0;
}
.com_title dt{
	max-width:300px;
	width: 27%;
	margin: 0 auto;
}
.com_title dd{
	text-align:center;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.com_title{
	margin-bottom: 30px;
}
.com_title::before{
	-webkit-transform: translateY(-80%);
	transform: translateY(-80%);
	width: 18%;}
.com_title dl{
	padding: 15px 0 10px 0;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.com_title{
	margin-bottom: 5%;
}
.com_title::before{
	-webkit-transform: translateY(-80%);
	transform: translateY(-80%);
	width: 30%;}
.com_title dl{
	padding: 20px 0 10px 0;
}
.com_title dt{
	width: 50%;
	margin: 0 auto;}
}





/*メインイメージ
---------------------------------------------------------*/
.m_img_bg{
	position: relative;
	background:url("../images/m_img.jpg") no-repeat center bottom;
	background-size:cover;
	opacity: 1;
    -webkit-transition: all 3s;
    -moz-transition: all 3s;
    transition: all 3s;
  animation-name: m_img_hover;
  animation-duration: 3s;
  animation-timing-function: linear;
	overflow: hidden;}
@keyframes m_img_hover {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.m_img_area .m_illust{
	max-width:430px;
	position: absolute;
	left: 0 ;
	bottom:0;
	width: 29%;
	z-index: 3;
}
.m_img_area .m_news{
	position: absolute;
	left: 0;
	bottom: 0;
	max-width: 680px;
	width: 60%;
	text-align: left;
	background:rgba(97,121,132,0.90);
	padding: 25px 20px 25px 35px;
	z-index: 5;
}
.m_img_area .m_news dl{
	position: relative;
}
.m_img_area .m_news dt{
	position: absolute;
	max-width: 113px;
	left: 0;
	top: 10px;
}
.m_img_area .m_news dd{
	padding-left: 135px;
	color:#000029;
	/*padding-top: 13px; 投稿なしの場合の調整*/
}
.m_img_area .m_news dd li{
	border-bottom:1px solid #000029;
	padding-bottom: 10px;
	margin-bottom: 10px;
}
.m_img_area .m_news dd li:last-child{
	border-bottom:none;
	padding-bottom: 0;
	margin-bottom: 0;
}
.m_img_area .m_news dd .scl_area{
    position: relative !important;
}
.m_img_area .m_news dd .scl_area ul{
	padding-right: 30px;
    height: 50px;
}
.m_img_area .m_logo{
	max-width:956px;
	padding: 30px 0 280px 0;
	width: 65%;
	margin: 0 5% 0 auto;
	position: relative;
	z-index: 2;
	opacity: 1;
    -webkit-transition: all 3s;
    -moz-transition: all 3s;
    transition: all 3s;
  animation-name: m_logo_hover;
  animation-duration: 3s;
  animation-timing-function: linear;
}
@keyframes m_logo_hover {
  0% {
    opacity: 0;
  }
	40% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.m_img_area .m_copy{
	max-width: 555px;
	width: 80%;
	margin:30px auto 0 auto;
}
.m_img_area .m_icon{
	position: absolute;
	right: 5%;
	bottom:30px;
	max-width: 194px;
	width: 20%;
}
.m_img_area .m_date{
	position:absolute;
	max-width: 580px;
	width: 45%;
	left: 5%;
	bottom:140px;
	z-index: 4;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.m_img_area .m_news{
	width: 60%;
	padding: 15px 15px 15px 25px;
}
.m_img_area .m_news dt{
	width: 17%;
	top: 10px;
}
.m_img_area .m_news dd{
	padding-left: 22%;
}
.m_img_area .m_news dd li{
	line-height: 1.5em;
}
.m_img_area .m_news dd .scl_area ul{
	padding-right: 10px;
    height: 53px;
   /* height: 30px;投稿なしの場合の調整*/
}
.m_img_area .m_logo{
	width: 70%;
	padding: 20px 0 230px 0;
}
.m_img_area .m_copy{
	max-width: 331px;
	width: 80%;
	margin:30px auto 0 auto;
}
.m_img_area .m_icon{
	position: absolute;
	right: 2%;
	bottom:20px;
	max-width: 194px;
	width: 17%;
}
.m_img_area .m_date{
	width: 45%;
	bottom:100px;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.m_img_bg{
	background:url("../images/m_img_sp.jpg") no-repeat center bottom;
	background-size:cover;}
.m_img_area .m_illust{
	width: 40%;
}
.m_img_area .m_news{
	max-width: 100%;
	width: 100%;
	padding: 3% 3% 3% 3%;
	box-sizing: border-box;
}
.m_img_area .m_news dt{
	width: 17%;
	top: 0.6em;
}
.m_img_area .m_news dd{
	padding-left: 22%;
	/*padding-top: 10px;投稿なしの場合の調整*/
}
.m_img_area .m_news dd li{
	line-height: 1.5em;
	font-size:90%;
}
.m_img_area .m_news dd .scl_area ul{
	padding-right: 3%;
    height: 60px;
   /* height: 30px;投稿なしの場合の調整*/
}
.m_img_area .m_logo{
	padding: 8vw 0 90vw 0;
	width: 95%;
	margin: 0 auto;
}	
.m_img_area .m_copy{
	padding-bottom: 0;
	width: 70%;
	max-width: 331px;
	margin:5% auto 0 auto;
}
.m_img_area .m_icon{
	right: 3%;
	bottom:23vw;
	width: 22%;
}
.m_img_area .m_date{
	width: 70%;
	left: 3%;
	bottom:25vw;
}
}




/* lead
---------------------------------------------------------*/
.lead_bg{
	padding-top:150px;
	background:url("../images/story_bg_top.jpg") no-repeat center top;
	background-size:100% auto;
	position: relative;
}
.lead_bg::before{
	display: block;
	content: "";
	position: absolute;
	left: 0;
	bottom:0;
	width:100%;
	height: 100%;
	max-height: 800px;
	background: url("../images/story_bg_bottom.jpg") no-repeat center bottom;
	background-size:100% 100%;
}
.lead_bg .abs_man.anime{
	position:absolute;
	left: -10%;
	bottom:1%;
	max-width: 835px;
	width: 45%;
	z-index: 2;
	opacity: 0;
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    transition: all 2s;
}
.lead_bg .abs_man.anime.anime_on{
	left: 0;
	opacity: 1;
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    transition: all 2s;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 1300px) { 
.lead_bg .abs_man.anime{
	left: -25%;
	width: 50%;
}
.lead_bg .abs_man.anime.anime_on{
	left: -10%;
}}


/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) { 
.lead_bg{
	padding-top:80px;}
.lead_bg .abs_man.anime{
	left: -25%;
	width: 43%;
}
.lead_bg .abs_man.anime.anime_on{
	left: -10%;
}}

/* Mobile (Portrait) 
------------------------------------------*/ 
@media only screen and (max-width: 767px) {
.lead_bg{
	background-size:150% auto;
	padding-top:13%;
	position: relative;
}
.lead_bg .abs_man.anime{
	left: -30%;
	width: 45%;
}
.lead_bg .abs_man.anime.anime_on{
	left: -20%;
}}





/* info
---------------------------------------------------------*/
#story{
	position: relative;
	z-index: 2;
}
#story .anime{
	opacity:1;
}
#story {
	margin-bottom:110px;
}
#story .story_bg{
	background:#ffffff;
	position: relative;
	color:#000029;
	text-align: center;
	padding: 70px 3%;
	font-size:110%;
	line-height: 2.3em;
	max-width: 1100px;
	margin: 0 auto;
}
#story .story_bg::before,
#story .story_bg::after{
	display:block;
	content: "";
	position: absolute;
	top: 0;
	max-width: 44px;
	width: 44px;
	height: 101%;
}
#story .story_bg::before{
	background:url("../images/story_bg_l.png") no-repeat left top;
	background-size:100% 100%;
	left: 0;
}
#story .story_bg::after{
	background:url("../images/story_bg_r.png") no-repeat right top;
	background-size:100% 100%;
	right: 0;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) { 
#story {
	margin-bottom:90px;
}
#story .story_bg{
	padding: 50px 0;
	font-size:100%;
	line-height: 1.8em;
}
}

/* Mobile (Portrait) 
------------------------------------------*/ 
@media only screen and (max-width: 767px) { 
#story {
	margin-bottom:10%;
}
#story .story_bg{
	padding: 5% 0;
	font-size:100%;
	line-height: 1.8em;
}
#story .story_bg::before,
#story .story_bg::after{
	width: 5vw;
	height: 101%;
}
}




/* info
---------------------------------------------------------*/
#info {	position:relative;
	z-index: 2;
}
#info .info_bg{
	position: relative;
	padding-bottom: 75px;
}
#info .w1100{
	position:relative;
}
#info .rel_box{
	position:relative;}
#info .info_inbox{
	width:67%;
	margin: 0 0 0 auto;
} 
#info .info_inbox .date{
	max-width: 586px;
	margin: 0 auto 35px 0;
}
#info .info_inbox .info_list li{
	margin-bottom:30px;
}
#info .info_inbox .info_list li:last-child{
	margin-bottom:40px;
}
#info .info_inbox .info_list li dl{
	position: relative;
	padding-left: 20%;
}
#info .info_inbox .info_list li dt{
	position:absolute;
	left: 0;
	top: 0;
	background: #d6b300;
	width: 17%;
	font-size:110%;
	text-align: center;
	padding: 10px 0;
}
#info .info_inbox .info_list li dd{
	padding-top:10px;
}
#info .info_inbox .info_list li dd p{
	font-size:150%;
	letter-spacing: 0.1em;
}
#info .info_inbox .info_list li dd p.txt_s{
	font-size:90%;
	line-height: 1.5em;
	margin-top: 0.5em;
}
#info .info_inbox .info_pre{
	position:relative;
	z-index: 1;
}
#info .info_inbox .info_pre .txt_box{
	background:#ffffff;
	border: 6px solid #ccb200;
	color:#000029;
	text-align: center;
	padding: 25px 0;
	position: relative;
	z-index: 3;
}
#info .info_inbox .info_pre .txt_box .txt1 dt{
	font-size:105%;
	letter-spacing: 0.1em;
}
#info .info_inbox .info_pre .txt_box .txt1 dd{
	font-size:160%;
	letter-spacing: 0.15em;
	line-height: 1.7em;
}
#info .info_inbox .info_pre .txt_box .txt1 dd p{
	position: relative;
	display: inline-block;
}
#info .info_inbox .info_pre .txt_box .txt1 dd p::before{
	position: absolute;
	display: inline-block;
	content: "";
	left: 0;
	bottom: 5px;
	height: 8px;
	width: 100%;
	background: #ccb200;
	z-index: 0;
}
#info .info_inbox .info_pre .txt_box .txt1 dd p span{
	position:relative;
	z-index: 2;
}
#info .info_inbox .info_pre .txt_box .txt1 > p{
	font-size:90%;
	margin-top: 5px;
}
#info .info_inbox .info_pre .txt_box .txt2{
	color:#8c0c15;
	letter-spacing: 0.15em;
	font-size:130%;
	background:url("../images/info_arrow.png") no-repeat center top;
	background-size:11px 10px;
	padding-top: 15px;
	margin-top: 8px;
}
#info .info_inbox .info_pre .txt_link{
	color:#8c0c15;
	border-bottom:1px solid #8c0c15;
}
#info .info_inbox .info_pre .txt_link:hover{
	border-bottom:none;
}
#info .abs_man.anime{
	position:absolute;
	left: -8%;
	bottom:1%;
	max-width: 235px;
	width: 20%;
	z-index: 8;
	opacity: 0;
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    transition: all 2s;
}
#info .abs_man.anime.anime_on{
	left: 7%;
	opacity: 1;
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    transition: all 2s;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) { 
#info .info_bg{
	padding-bottom: 50px;
}
#info .info_inbox .date{
	margin: 0 auto 20px 0;
}
#info .info_inbox .info_list li{
	margin-bottom:20px;
}
#info .info_inbox .info_list li:last-child{
	margin-bottom:30px;
}
#info .info_inbox .info_list li dt{
	width: 18%;
	font-size:100%;
	padding: 10px 0;
}
#info .info_inbox .info_list li dd{
	padding-top:10px;
}
#info .info_inbox .info_list li dd p{
	font-size:140%;
}
#info .info_inbox .info_pre .txt_box{
	padding: 25px 0;
}
#info .info_inbox .info_pre .txt_box .txt1 dt{
	font-size:100%;
}
#info .info_inbox .info_pre .txt_box .txt1 dd{
	font-size:140%;
	letter-spacing: 0.05em;
	line-height: 1.7em;
}
#info .info_inbox .info_pre .txt_box .txt1 > p{
	font-size:70%;
	margin-top: 5px;
}
#info .info_inbox .info_pre .txt_box .txt2{
	letter-spacing: 0.1em;
	font-size:120%;
	padding-top: 10px;
}
}

/* Mobile (Portrait) 
------------------------------------------*/ 
@media only screen and (max-width: 767px) { 
#info .info_bg{
	padding-bottom: 10%;
}
#info .info_inbox{
	width:100%;
	margin: 0 0 0 auto;
} 
#info .info_inbox .date{
	margin: 0 auto 7% auto;
}
#info .info_inbox .info_list li{
	margin-bottom:3%;
}
#info .info_inbox .info_list li:last-child{
	margin-bottom:5%;
}
#info .info_inbox .info_list li dl{
	padding-left: 32%;
}
#info .info_inbox .info_list li dt{
	width: 27%;
	font-size:105%;
	padding: 5px 0;
}
#info .info_inbox .info_list li dd{
	padding-top:3px;
}
#info .info_inbox .info_list li dd p{
	font-size:140%;
}
#info .info_inbox .info_list li dd p.txt_s{
	font-size:80%;
	margin-top: 0.3em;
}
#info .info_inbox .info_pre{
	width: 85%;
	margin: 0 0 0 auto;
}
#info .info_inbox .info_pre .txt_box{
	padding: 6% 0;
}
#info .info_inbox .info_pre .txt_box .txt1 dt{
	font-size:95%;
	letter-spacing: 0.05em;
}
#info .info_inbox .info_pre .txt_box .txt1 dd{
	font-size:120%;
	letter-spacing: 0.05em;
}
#info .info_inbox .info_pre .txt_box .txt1 > p{
	font-size:70%;
	margin-top: 5px;
}
#info .info_inbox .info_pre .txt_box .txt2{
	letter-spacing: 0.1em;
	font-size:110%;
	padding-top: 10px;
}
#info .abs_man.anime{
	left: -8%;
	bottom:-4%;
	width: 21%;
	max-width: 100px;
}
#info .abs_man.anime.anime_on{
	left: -2%;
}
}





/* howto
---------------------------------------------------------*/
#howto .howto_bg{
	position: relative;
}
#howto .howto_bg.anime::before{
	display:block;
	content: "";
	position: absolute;
	z-index: -1;
	right: 0;
	bottom:-250px;
	max-width: 420px;
	width: 420px;
	height:426px;
	background:url("../images/howto_bg.png") no-repeat right bottom;
	background-size: 100% auto;
	opacity: 0;
}
#howto .howto_bg.anime.anime_on::before{
	opacity: 1;
  animation-name: hikari_bg;
  animation-duration: 2s;
  animation-timing-function: linear;
	overflow: hidden;
}
@keyframes hikari_bg {
  0% {
    opacity: 0;
  }
	30% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

#howto .flow{
	margin-bottom:80px;
}
#howto .flow .flow_list > li{
	float:left;
	width: 32%;
	margin-right: 2%;
	position: relative;
}
#howto .flow .flow_list > li::after{
	display:block;
	content: "";
	position: absolute;
	right: 0;
	z-index: 2;
	top:calc(50% - 35px);
	-webkit-transform: translateX(50%);
	transform: translateX(50%);
	width: 70px;
	height: 70px;
	max-width: 70px;
	background:url("../images/how_flow_arrow.png") no-repeat center center;
	background-size:100% auto;
}
#howto .flow .flow_list > li:last-child{
	margin-right: 0;
}
#howto .flow .flow_list > li:last-child::after{
	display:none;
}

#howto .map .map_bg{
	position:relative;
	margin-bottom: 20px;
}
#howto .map .map_icon{
	position: absolute;
	max-width: 166px;
	width: 15%;
	left: 10px;
	bottom:100%;	
	-webkit-transform: translateY(50%);
	transform: translateY(50%);
}
#howto .map .map_btn{
	max-width: 400px;
	margin: 0 auto;
}
#howto .map .map_btn a{
	display:block;
	border-radius: 40px;
	padding: 20px 0;
	font-size:120%;
	color:#000029;
	text-align: center;
	position: relative;
	background: url("../images/how_mapbtn_icon.png") no-repeat 40px center #ffffff;
	background-size:45px 45px;
}
#howto .map .map_btn a::before{
	display: block;
	content: "";
	position: absolute;
	right: 15px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width:33px;
	height: 33px;
	background: url("../images/how_mapbtn_arrow.png") no-repeat center center;
	background-size:100% auto;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) { 
#howto .howto_bg.anime::before{
	bottom:-150px;
	width: 25%;
}
}

/* Mobile (Portrait) 
------------------------------------------*/ 
@media only screen and (max-width: 767px) { 
#howto .howto_bg.anime::before{
	bottom:-25vw;
	width: 35%;
}
#howto .flow{
	margin-bottom:8%;
}
#howto .flow .flow_list > li{
	max-width: 348px;
	margin: 0 auto 3% auto;
	float:none;
	width: 65%;
	position: relative;
}
#howto .flow .flow_list > li::after{
	right: 0;
	left: 0;
	margin: 0 auto;
	z-index: 2;
	top:100%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 15%;
	background:url("../images/how_flow_arrow_sp.png") no-repeat center center;
	background-size:100% auto;
}
#howto .flow .flow_list > li:last-child{
	margin-right: auto;
}
#howto .flow .flow_list > li:last-child::after{
	display:none;
}

#howto .map .map_bg{
	margin-bottom: 5%;
}
#howto .map .map_icon{
	width: 22%;
	left: 10px;
}
#howto .map .map_btn{
	max-width: 100%;
	margin: 0 auto;
}
#howto .map .map_btn a{
	padding: 5% 0;
	font-size:110%;
	background: url("../images/how_mapbtn_icon.png") no-repeat 5vw center #ffffff;
	background-size:8vw auto;
}
#howto .map .map_btn a::before{
	right: 3%;
	width:6vw;
}	
}





/* trial
---------------------------------------------------------*/
#trial .tri_list > li dt span{
	display: block;
	position: relative;
}
#trial .tri_list > li .tri_a_box dt.open_btn span::before{
	display: block;
	position: absolute;
	content: "";
	width: 36px;
	height: 36px;
	background-image:url("../images/drw_btn_d.png");
	background-size:100% auto;
	background-position: center center;
	background-repeat: no-repeat;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	right: 0;
}
#trial .tri_list > li .tri_a_box dt.open_btn.active span::before{
	background-image:url("../images/drw_btn_u.png");
}
#trial .tri_list > li dd{
	margin-top: 40px;
}

#trial .tri_list > li .tri_a_box dt.open_btn .txt_open {
	display: block;	/* 初期表示 */
}
#trial .tri_list > li .tri_a_box dt.open_btn .txt_close {
	display: none;	/* 初期表示 */
}
#trial .tri_list > li .tri_a_box dt.open_btn.active .txt_open {
	display: none;	/* 質問表示時 */
}
#trial .tri_list > li .tri_a_box dt.open_btn.active .txt_close {
	display: block;	/* 質問表示時 */
}
#trial .tri_list > li .tri_a_box dd {
	display: none;	/* 初期表示 */
}
#trial .tri_list > li .tri_q_box,
#trial .tri_list > li .tri_a_box{
	padding:40px;
}
#trial .tri_list > li .tri_q_box{
	background:#ffffff;
}
#trial .tri_list > li .tri_a_box{
	background:#ccb200;
	margin-top: 10px;
}
#trial .tri_list > li .tri_a_box span{
	display:block;
	text-align: center;
	font-size:150%;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) { 
#trial .tri_list > li .tri_q_box,
#trial .tri_list > li .tri_a_box{
	padding:20px;
}
#trial .tri_list > li dd{
	margin-top: 20px;
}
}

/* Mobile (Portrait) 
------------------------------------------*/ 
@media only screen and (max-width: 767px) { 
#trial .tri_list > li .tri_a_box dt.open_btn span::before{
	width: 6vw;
}
#trial .tri_list > li dd{
	margin-top: 3%;
}
#trial .tri_list > li .tri_q_box,
#trial .tri_list > li .tri_a_box{
	padding:3%;
}
#trial .tri_list > li .tri_a_box{
	margin-top: 10px;
}
#trial .tri_list > li .tri_a_box span{
	font-size:130%;
}	
}





/* access
---------------------------------------------------------*/
#access .acs_bg{
	position: relative;
	
}
#access .acs_bg .w1250{
	position: relative;
	z-index: 1;
	
}
#access .w1100{
	position:relative;
	z-index: 2
}

#access .acs_bg.anime::before{
	display:block;
	content: "";
	position: absolute;
	z-index: -1;
	left: 0;
	bottom:-280px;
	max-width: 420px;
	width: 420px;
	height:351px;
	background:url("../images/access_bg.png") no-repeat left bottom;
	background-size: 100% auto;
	opacity: 0;
}
#access .acs_bg.anime.anime_on::before{
	opacity: 1;
  animation-name: hikari_bg;
  animation-duration: 2s;
  animation-timing-function: linear;
	overflow: hidden;
}


#access .acs_btn_list li{
	float: left;
	width: 49.5%;
}
#access .acs_btn_list li:last-child{
	float: right;
}
#access .acs_btn_list li a{
	display:block;
	padding: 35px 0;
	font-size:130%;
	color:#000029;
	text-align: center;
	position: relative;
	background: url("../images/acs_btn1_icon.png") no-repeat 40px center #ffffff;
	background-size:88px 71px;
}
#access .acs_btn_list li:last-child a{
	background: url("../images/acs_btn2_icon.png") no-repeat 40px center #ffffff;
	background-size:88px 71px;
}
#access .acs_btn_list li a::before{
	display: block;
	content: "";
	position: absolute;
	right: 25px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width:33px;
	height: 33px;
	background: url("../images/how_mapbtn_arrow.png") no-repeat center center;
	background-size:100% auto;
}
/* PC調整
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width:1100px) {
#access .acs_btn_list li a{
	background: url("../images/acs_btn1_icon.png") no-repeat 15px center #ffffff;
	background-size:65px auto;
}
#access .acs_btn_list li:last-child a{
	background: url("../images/acs_btn2_icon.png") no-repeat 15px center #ffffff;
	background-size:65px auto;
}}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) { 
#access .acs_bg.anime::before{
	bottom:-150px;
	width: 25%;
}
#access .acs_btn_list li a{
	padding: 25px 0;
	font-size:120%;
	background: url("../images/acs_btn1_icon.png") no-repeat 15px center #ffffff;
	background-size:45px auto;
}
#access .acs_btn_list li:last-child a{
	background: url("../images/acs_btn2_icon.png") no-repeat 15px center #ffffff;
	background-size:45px auto;
}
#access .acs_btn_list li a::before{
	right: 15px;
	width:20px;
}
}

/* Mobile (Portrait) 
------------------------------------------*/ 
@media only screen and (max-width: 767px) { 
#access .acs_bg.anime::before{
	bottom:-30vw;
	width: 35%;
}	
#access .acs_btn_list li{
	float: none;
	width: 100%;
}
#access .acs_btn_list li:last-child{
	float: none;
	margin-top: 3%;
}
#access .acs_btn_list li a{
	padding: 6% 0;
	font-size:4.8vw;
	background: url("../images/acs_btn1_icon.png") no-repeat 2vw center #ffffff;
	background-size:15vw auto;
}
#access .acs_btn_list li:last-child a{
	background: url("../images/acs_btn2_icon.png") no-repeat 2vw center #ffffff;
	background-size:15vw auto;
}
#access .acs_btn_list li a::before{
	right: 3%;
	width:6vw;
}	
}






/* QA
---------------------------------------------------------*/
#qa{
	position:relative;
}
#qa .qa_list > li{
	margin-bottom:3px;
	background: #617984;
	padding: 25px 25px;
}
#qa .qa_list > li dt{
	font-size:125%;
	letter-spacing: 0.07em;
	cursor: pointer;
}
#qa .qa_list > li dt span{
	display: block;
	position: relative;
	padding-right: 25px;
}
#qa .qa_list > li dt.open_btn span::before{
	display: block;
	position: absolute;
	content: "";
	width: 25px;
	height: 25px;
	background-image:url("../images/drw_btn_d.png");
	background-size:100% auto;
	background-position: center center;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	right: 0;
}
#qa .qa_list > li dt.open_btn.active span::before{
	background-image:url("../images/drw_btn_u.png");
}
#qa .qa_list > li dd{
	margin-top: 10px;
}
#qa .qa_list > li dt.open_btn .txt_open {
	display: block;	/* 初期表示 */
}
#qa .qa_list > li dt.open_btn .txt_close {
	display: none;	/* 初期表示 */
}
#qa .qa_list > li dt.open_btn.active .txt_open {
	display: none;	/* 質問表示時 */
}
#qa .qa_list > li dt.open_btn.active .txt_close {
	display: block;	/* 質問表示時 */
}
#qa .qa_list > li dd {
	display: none;	/* 初期表示 */
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) { 
#qa .qa_list > li{
	padding: 20px 25px;
}
#qa .qa_list > li dt{
	font-size:115%;
}
}

/* Mobile (Portrait) 
------------------------------------------*/ 
@media only screen and (max-width: 767px) { 
#qa .qa_list > li{
	padding: 3% 4%;
}
#qa .qa_list > li dt{
	font-size:4.2vw;
	line-height: 1.5em;
}
#qa .qa_list > li dt span{
	padding-right: 7vw;
}
#qa .qa_list > li dt.open_btn span::before{
	width: 6vw;
	height: 6vw;}
}





/* caution
---------------------------------------------------------*/
#caution .caution_box{
	border:1px solid #ffffff;
	padding: 55px 75px;
}
#caution .caution_box dt{
	font-size:110%;
	letter-spacing: 0.1em;
	border-bottom: #ffffff 1px solid;
	padding-bottom: 10px;
	margin-bottom: 15px;
}
#caution .caution_box .caution_list > li{
	margin-bottom:55px;
}
#caution .caution_box .caution_list > li:last-child{
	margin-bottom:0;
}
#caution .caution_box .txt_link{
	color:#49EEFF;
}
#caution .caution_box .txt_link::after{
	background:#49EEFF;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) { 
#caution .caution_box{
	padding: 30px;
}
#caution .caution_box .caution_list > li{
	margin-bottom:30px;
}
}

/* Mobile (Portrait) 
------------------------------------------*/ 
@media only screen and (max-width: 767px) { 
#caution .caution_box{
	padding: 5%;
}
#caution .caution_box dt{
	font-size:4vw;
	padding-bottom: 2%;
	margin-bottom: 3%;
}
#caution .caution_box dd{
	font-size:90%;
	line-height: 1.5em;}

#caution .caution_box .caution_list > li{
	margin-bottom:5%;
}
}





/* 
---------------------------------------------------------*/

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) { 
}

/* Mobile (Portrait) 
------------------------------------------*/ 
@media only screen and (max-width: 767px) { 
}





/* 
---------------------------------------------------------*/

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) { 
}

/* Mobile (Portrait) 
------------------------------------------*/ 
@media only screen and (max-width: 767px) { 
}