@charset "UTF-8";



.breadcrumb {
  padding: 6px 12px;
  margin-bottom: 0px;
  list-style: none;
  background-color: #3e3e3e;
  border-radius: 4px;
  margin-top:-8px;
}
.breadcrumb > li {
  display: inline-block;
}
.breadcrumb > li + li:before {
  padding: 0 5px;
  color: #ccc;
  content: ">\00a0";
}
.breadcrumb > .active {
  color: #ffc400;
}
.breadcrumb a {
  color: #ffc400;
  font-size:1.2rem;
}
.breadcrumb em,
.breadcrumb span {
  color: #FFFFFF;
  font-size:1.2rem;
}
@media screen and (max-width: 979px) {
	.breadcrumb {
	  padding: 4px 12px 6px;
	  line-height:14px;
		margin-top:-30px;
	}
}

.nts_r{
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
	font-style: normal;
}
.nts_bold{
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 700;
	font-style: normal;
}
.nts_black{
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 900;
	font-style: normal;
}

#contents_head{ display: none;}

#xxio12{ padding:0 0 0px 0; margin: 0 0 50px 0; }

#xxio12 .pcview{ display: block; }
#xxio12 .spview{ display: none; }

#xxio12 #xxio12_head{ margin: 0 0 50px 0; }
#xxio12 #xxio12_head h2{ margin: 0 0 0 0; }

#xxio12 #tech{ clear: both; background: #e6e6e6; padding: 60px 0 0; margin: 0 0 0 0; }
#xxio12 #tech h3{ display: block; margin: 0 0 50px 0; text-align: center; }
#xxio12 #tech h3 img{ width: 240px; }
#xxio12 #tech #tech_inner{ background: url(../../../../campaign/xxio-12/images/tech_img00.png) no-repeat center top; padding: 0 0 50px 0;}
#xxio12 #tech #tech_inner #tech_inner_body{ width: 950px; margin: 0 auto;}
#xxio12 #tech #tech_inner h4{ display: block; margin: 0 0 60px 0; text-align: center; }
#xxio12 #tech #tech_inner h4 img{ width: 530px; }
#xxio12 #tech #tech_inner #tech_inner_body .texhbox01{ width: 950px; margin: 0 auto 40px;}
#xxio12 #tech #tech_inner #tech_inner_body .texhbox01 img{ width: 100%; }
#xxio12 #tech #tech_inner #tech_inner_body .texhbox01:last-of-type{ margin: 0 auto 0px;}
#xxio12 #techfooter{ clear: both; background: #FFF; margin: 0 0 50px 0; }
#xxio12 #techfooter #techfooter_inner{ background: url(../../../../campaign/xxio-12/images/tech_img00.png) no-repeat center bottom; height: 80px; }

#xxio12 #mvarea{ clear: both; padding: 0 0 0; margin: 0 0 50px 0; }
#xxio12 #mvarea h3{ display: block; margin: 0 0 0 0; text-align: center; }
#xxio12 #mvarea h3 img{ width: 100%; }

#xxio12 #kaikae{ clear: both; background: #0a345e; padding: 40px 0 70px; margin: 0 0 0 0; }
#xxio12 #kaikae h3{ display: block; margin: 0 0 10px 0; text-align: center; letter-spacing: -.4em; }
#xxio12 #kaikae h3 strong{ display: inline-block; position: relative; letter-spacing: normal; }
#xxio12 #kaikae h3 strong span{ display:block; position: absolute; left: 0; top: 30px; }
#xxio12 #kaikae h3 strong span a:hover{ opacity: 0.7; }
#xxio12 #kaikae ul{ display: block; margin: 0 0 0 0; }
#xxio12 #kaikae ul.list01{ display: block; margin: 0 0 0 0; padding: 0 0 50px 0; }
#xxio12 #kaikae ul.list01 li{ display: block; margin: 0 0 0 0; text-align: center; }
#xxio12 #kaikae ul.list02{ display: block; margin: 0 0 30px 0; padding: 0 0 0 0; }
#xxio12 #kaikae ul.list02 li{ display: block; margin: 0 0 25px 0; text-align: center; }
#xxio12 #kaikae ul.list02 li:last-of-type{ margin: 0 0 0px;}
#xxio12 #kaikae .openbtn01{ display: block; margin: 0 0 30px 0; text-align: center; cursor: pointer; }
#xxio12 #kaikae .openbtn01:hover{ opacity: 0.8; }
#xxio12 #kaikae .img01{ display: block; margin: 0 0 40px 0; text-align: center; padding: 70px 0 0 0; }
#xxio12 #kaikae .footbtn01{ display: block; margin: 0 0 0 0; text-align: center; }
#xxio12 #kaikae .footbtn01 a:hover{ opacity: 0.8; }

#xxio12 #shida{ clear: both; background: #FFF; padding: 20px 0 0; margin: 0 0 0 0; }
#xxio12 #shida #shida01{ width: 1000px; margin: 0 auto 80px;}
#xxio12 #shida #shida01 h3{ display: block; margin: 0 auto 0;}
#xxio12 #shida #shida01 .img01{ display: block; margin: 0 0 50px 0; text-align: center; }
#xxio12 #shida #shida01 .img02{ display: block; margin: 0 0 50px 0; text-align: center; }
#xxio12 #shida #shida01 .img03{ display: block; margin: 0 0 0 0; text-align: center; padding:30px 0 0 0; }
#xxio12 #shida .moviebox { width: 850px; margin: 0 auto 0; }
#xxio12 #shida .moviebox .movie01 { position: relative; width: 100%; padding-top: 56.25%; }
#xxio12 #shida .moviebox .movie01 iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; }

#xxio12 #shida #shida02{ width: 1000px; margin: 0 auto 60px; padding:40px 0 0 0; background: url(../../../../campaign/xxio-12/images/shida02_bg01.png) no-repeat center top; }
#xxio12 #shida #shida02 h3{ margin: -120px auto 0; text-align: center; }
#xxio12 #shida #shida02 #shida02_inner{ padding:40px 0 50px 0; background: url(../../../../campaign/xxio-12/images/shida02_bg01.png) no-repeat center bottom; }
#xxio12 #shida #shida03{ width: 1000px; margin: 0 auto 60px; padding:40px 0 0 0; background: url(../../../../campaign/xxio-12/images/shida03_bg01.png) no-repeat center top; }
#xxio12 #shida #shida03 h3{ margin: 0 auto 0; text-align: right; }
#xxio12 #shida #shida03 #shida03_inner{ padding:40px 0 50px 0; background: url(../../../../campaign/xxio-12/images/shida03_bg01.png) no-repeat center bottom; }

#xxio12 #osusume{ clear: both; background: #FFF; padding: 60px 0 0; margin: 0 0 0 0; }
#xxio12 #osusume h3{ display: block; margin: 0 0 40px 0; text-align: center; }
#xxio12 #osusume h3 img{ width: 820px; }
#xxio12 #osusume #osusume_inner{ background: url(../../../../campaign/xxio-12/images/osusume_img00.png) no-repeat center top; padding: 0 0 0 0;}
#xxio12 #osusume #osusume_inner h4{ display: block; margin: 0 0 50px 0; text-align: center; }
#xxio12 #osusume #osusume_inner h4 img{ width: 120px; }
#xxio12 #osusume #osusume_inner h5{ display: block; margin: 0 0 50px 0; text-align: center; }
#xxio12 #osusume #osusume_inner .o_box01{ margin: 0 0 20px 0; text-align: center; }
#xxio12 #osusume #osusume_inner .o_box01 p{ margin: 0 0 0 0; }
#xxio12 #osusume #osusume_inner .o_box02{ margin: 0 0 20px 0; text-align: center; }
#xxio12 #osusume #osusume_inner .o_box03{ margin: 0 0 0 0; text-align: center; }
#xxio12 #osusumefooter{ clear: both; background: #FFF; margin: 0 0 50px 0; }
#xxio12 #osusumefooter #osusumefooter_inner{ background: url(../../../../campaign/xxio-12/images/osusume_img00.png) no-repeat center bottom; height: 80px; }

#xxio12 #present{ clear: both; background: #fff11b; padding: 60px 0 60px; margin: 0 0 0 0; }
#xxio12 #present h3{ display: block; margin: 0 0 50px 0; text-align: center; }
#xxio12 #present h4{ display: block; margin: 0 0 20px 0; text-align: center; }
#xxio12 #present .prebox01{ display: block; margin: 0 0 20px 0; text-align: center; letter-spacing: -.4em; }
#xxio12 #present .prebox01.mgnb{ margin: 0 0 40px 0; }
#xxio12 #present .prebox01 p{ display: inline-block; position: relative; letter-spacing: normal; margin: 0 0 0 0; }
#xxio12 #present .prebox01 p span{ display:block; position: absolute; left: 38%; bottom: 40px; }
#xxio12 #present .prebox01 p span a:hover{ opacity: 0.7; }

#xxio12 #store{ clear: both; background: #FFF; padding: 60px 0 60px; margin: 0 0 0 0; }
#xxio12 #store h3{ display: block; margin: 0 0 40px 0; text-align: center; }
#xxio12 #store h4{ display: block; margin: 0 0 50px 0; text-align: center; }
#xxio12 #store .storebox01{ display: block; text-align: center; }
#xxio12 #store .storebox01 a:hover{ opacity: 0.7; }

#xxio12 #torikumi{ clear: both; background: #000000; padding: 60px 0 70px; margin: 0 0 0 0; }
#xxio12 #torikumi h3{ display: block; margin: 0 0 0 0; text-align: center; }

#xxio12 #localfoot{ clear: both; background: #fff11b; padding: 60px 0 70px; margin: 0 0 0 0; }
#xxio12 #localfoot h3{ display: block; margin: 0 0 50px 0; text-align: center; }
#xxio12 #localfoot h3 a:hover{ opacity: 0.7; }
#xxio12 #localfoot .footcopy{ display: block; margin: 0 0 0 0; text-align: center; }



@media screen and (min-width: 768px) and (max-width: 979px) {

	#xxio12 #xxio12_head{ margin: 0 0 40px 0; }
	#xxio12 #xxio12_head img{ width: 100%; }
	#xxio12 #itemlist{ background: #221815; margin: 0 0 40px 0; }
	#xxio12 #itemlist h3{  display: block; margin: 0 0 0 0; }
	#xxio12 #itemlist h3 img{ width: 100%; }
	#xxio12 #itemlist #itemlist_inner{ padding:40px 40px 40px; }
	#xxio12 #itemlist #itemlist_inner h4{ display: block; margin: 0 0 30px 0; }
	#xxio12 #itemlist #itemlist_inner h4 img{ margin: 0 25px 0 0; }
	#xxio12 #itemlist #itemlist_inner .pricebox{ display: inline-block; font-size: 20px; letter-spacing: 1px; border: 1px solid #FFF; color: #FFF; padding: 8px 10px; margin: 0 0 35px 0; }
	#xxio12 #itemlist #itemlist_inner .txtbox{ display:block; font-size: 18px; line-height: 1.8; letter-spacing: 1px; color: #FFF; margin: 0 0 40px 0; }
	#xxio12 #itemlist #itemlist_inner .txtbox02{ display:block; font-size: 14px; line-height: 1.8; letter-spacing: 1px; color: #FFF; margin:30px 0 0 0; }
	#xxio12 #itemlist #itemlist_inner dl{ display: block; width: 50%; float: left; }
	#xxio12 #itemlist #itemlist_inner dl dt{ display: block; text-align: center; margin: 0 0 8px 0; }
	#xxio12 #itemlist #itemlist_inner dl dd{ display: block; text-align: center; font-size: 16px; color: #FFF; }
	#xxio12 #itemlist #itemlist_inner dl dd strong{ display: inline-block; font-weight: normal; font-size: 16px; letter-spacing: 1px; border: 1px solid #FFF; padding: 3px 10px; margin: 0 0 8px 0; }
	#xxio12 #itemlist #itemlist_inner dl dd span{ display:block; }
	#xxio12 #xxio12_foot{ width: 100%; margin: 0 0 0 0; clear: both; padding:0px 0 0 0; }
	#xxio12 #xxio12_foot .txt01{ display: block; text-align: center; margin: 0 auto 30px; font-size:22px; line-height: 1.5; font-weight: bold;}
	#xxio12 #xxio12_foot .btnbox{ width: 560px; margin: 0 auto 0px; }

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

	#xxio12 .pcview{ display: none; }
	#xxio12 .spview{ display: block; }

	#xxio12 #xxio12_head{ margin: 0 0 20px 0; }

	#xxio12 #tech{ padding: 40px 0 0; margin: 0 0 0 0; }
	#xxio12 #tech h3{ margin: 0 0 30px 0; }
	#xxio12 #tech h3 img{ width: 56%; }
	#xxio12 #tech #tech_inner{ background: url(../../../../campaign/xxio-12/images/sp/tech_img00.png) no-repeat left top; background-size: 12% auto; padding: 0 0 20px 0;}
	#xxio12 #tech #tech_inner #tech_inner_body{ width: 100%;}
	#xxio12 #tech #tech_inner h4{ display: block; margin: 0 0 30px 0; text-align: center; }
	#xxio12 #tech #tech_inner h4 img{ width: 76.5%; }
	#xxio12 #tech #tech_inner #tech_inner_body .texhbox01{ width: 89%; margin: 0 4% 20px 7%; }
	#xxio12 #tech #tech_inner #tech_inner_body .texhbox01 img{ width: 100%; }
	#xxio12 #tech #tech_inner #tech_inner_body .texhbox01:last-of-type{ margin: 0 4% 0 7%;}
	#xxio12 #techfooter{ clear: both; background: #FFF; margin: 0 0 10px 0; }
	#xxio12 #techfooter #techfooter_inner{ background: url(../../../../campaign/xxio-12/images/sp/tech_img00.png) no-repeat left bottom; background-size: 12% auto; height: 30px; }

	#xxio12 #mvarea{ padding: 0 0 0; margin: 0 0 30px 0; }

	#xxio12 #kaikae{ padding: 20px 3.5% 40px; margin: 0 0 0 0; }
	#xxio12 #kaikae h3{ display: block; margin: 0 0 0px 0; }
	#xxio12 #kaikae h3 img{ width: 100%; }
	#xxio12 #kaikae h3 strong span{ position: static; left: 0; top: 0; margin: 0 0 10px 0; }
	#xxio12 #kaikae ul{ display: block; margin: 0 0 0 0; }
	#xxio12 #kaikae ul.list01{ margin: 0 0 0 0; padding: 0 0 20px 0; }
	#xxio12 #kaikae ul.list01 li{ display: block; margin: 0 0 0 0; text-align: center; }
	#xxio12 #kaikae ul.list02{ display: block; margin: 0 0 30px 0; padding: 0 0 0 0; }
	#xxio12 #kaikae ul.list02 li{ display: block; margin: 0 0 15px 0; text-align: center; }
	#xxio12 #kaikae ul.list02 li:last-of-type{ margin: 0 0 0px;}
	#xxio12 #kaikae .openbtn01sp{ display: block; margin: 0 0 20px 0; text-align: center;}
	#xxio12 #kaikae .openbtn01sp img{ width: 84%; }
	#xxio12 #kaikae .img01{ display: block; margin: 0 0 20px 0; text-align: center; padding: 30px 0 0 0; }
	#xxio12 #kaikae .img01 img{ width: 84%; }
	#xxio12 #kaikae .footbtn01{ display: block; margin: 0 0 0 0; text-align: center; }
	#xxio12 #kaikae .footbtn01 img{ width: 84%; }

	#xxio12 #shida{ padding: 20px 0 0; margin: 0 0 0 0; }
	#xxio12 #shida #shida01{ width:100%; margin: 0 auto 40px;}
	#xxio12 #shida #shida01 h3{ display: block; margin: 0 auto 5px; text-align: center;}
	#xxio12 #shida #shida01 h3 img{ width: 77.5%;}
	#xxio12 #shida #shida01 .img01{ display: block; margin: 0 0 5px 0; text-align: center; }
	#xxio12 #shida #shida01 .img01 img{ width:96%;}
	#xxio12 #shida #shida01 .img02{ display: block; margin: 0 0 20px 0; text-align: center; }
	#xxio12 #shida #shida01 .img02 img{ width:96%;}
	#xxio12 #shida #shida01 .img03{ display: block; margin: 0 0 0 0; text-align: center; padding:10px 0 0 0; }
	#xxio12 #shida #shida01 .img03 img{ width:96%;}
	#xxio12 #shida .moviebox { width: 86%; margin: 0 auto 0; }
	#xxio12 #shida .moviebox .movie01 { position: relative; width: 100%; padding-top: 56.25%; }
	#xxio12 #shida .moviebox .movie01 iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; }

	#xxio12 #shida #shida02{ width:100%; margin: 0 auto 30px; padding:20px 0 0 0; background: url(../../../../campaign/xxio-12/images/shida02_bg01.png) no-repeat center top; background-size: 100% auto; }
	#xxio12 #shida #shida02 h3{ margin: -30px auto 0; text-align: center; }
	#xxio12 #shida #shida02 h3 img{ width: 84.1%; }
	#xxio12 #shida #shida02 #shida02_inner{ padding:20px 0 30px 0; background: url(../../../../campaign/xxio-12/images/shida02_bg01.png) no-repeat center bottom; background-size: 100% auto; }
	#xxio12 #shida #shida03{ width: 100%; margin: 0 auto 30px; padding:20px 0 0 0; background: url(../../../../campaign/xxio-12/images/sp/shida03_bg01.png) no-repeat center top; background-size: 100% auto; }
	#xxio12 #shida #shida03 h3{ margin: 0 auto 0; text-align: center; }
	#xxio12 #shida #shida03 h3 img{ width: 85%; }
	#xxio12 #shida #shida03 #shida03_inner{ padding:20px 0 30px 0; background: url(../../../../campaign/xxio-12/images/sp/shida03_bg01.png) no-repeat center bottom #FFF; background-size: 100% auto; }

	#xxio12 #osusume{ clear: both; background: #FFF; padding:20px 0 0; margin: 0 0 0 0; }
	#xxio12 #osusume h3{ display: block; margin: 0 0 20px 0; text-align: center; }
	#xxio12 #osusume h3 img{ width: 83%; }
	#xxio12 #osusume #osusume_inner{ background: url(../../../../campaign/xxio-12/images/sp/osusume_img00.png) no-repeat left top; background-size: 12% auto; padding: 0 0 0 0;}
	#xxio12 #osusume #osusume_inner h4{ display: block; margin: 0 0 20px 0; text-align: center; }
	#xxio12 #osusume #osusume_inner h4 img{ width: 29%; }
	#xxio12 #osusume #osusume_inner h5{ display: block; margin: 0 0 30px 0; text-align: center; }
	#xxio12 #osusume #osusume_inner h5 img{ width: 63%; }
	#xxio12 #osusume #osusume_inner .o_box01{ width: 89%; margin: 0 4% 20px 7%; text-align: center; font-size: 0; line-height: 0; }
	#xxio12 #osusume #osusume_inner .o_box01 p{ margin: 0 0 0 0; }
	#xxio12 #osusume #osusume_inner .o_box02{ width: 89%; margin: 0 4% 20px 7%; text-align: center; }
	#xxio12 #osusume #osusume_inner .o_box03{ width: 89%; margin: 0 4% 0 7%; text-align: center; }
	#xxio12 #osusumefooter{ clear: both; background: #FFF; margin: 0 0 50px 0; }
	#xxio12 #osusumefooter #osusumefooter_inner{ background: url(../../../../campaign/xxio-12/images/sp/osusume_img00.png) no-repeat left bottom; background-size: 12% auto; height: 30px; }

	#xxio12 #present{ padding:30px 3.5% 20px; margin: 0 0 0 0; box-sizing: border-box; }
	#xxio12 #present h3{ display: block; margin: 0 0 30px 0; text-align: center; }
	#xxio12 #present h3 img{ width: 37%; }
	#xxio12 #present h4{ display: block; margin: 0 0 20px 0; text-align: center; }
	#xxio12 #present h4 img{ width: 85%; }
	#xxio12 #present .prebox01{ display: block; margin: 0 0 20px 0; }
	#xxio12 #present .prebox01.mgnb{ margin: 0 0 20px 0; }
	#xxio12 #present .prebox01 p{ display: inline-block; position: relative; letter-spacing: normal; margin: 0 0 0 0; }
	#xxio12 #present .prebox01 p span{ display:block; position: absolute; left: 38%; bottom: 40px; }
	#xxio12 #present .prebox01 p span a:hover{ opacity: 0.7; }

	#xxio12 #store{ clear: both; background: #e6e6e6; padding:30px 0 30px; margin: 0 0 0 0; }
	#xxio12 #store h3{ display: block; margin: 0 0 30px 0; text-align: center; }
	#xxio12 #store h3 img{ width: 26%; }
	#xxio12 #store h4{ display: block; margin: 0 0 30px 0; text-align: center; }
	#xxio12 #store h4 img{ width: 76%; }
	#xxio12 #store .storebox01{ display: block; text-align: center; }
	#xxio12 #store .storebox01 a:hover{ opacity: 0.7; }

	#xxio12 #torikumi{ clear: both; padding:30px 030px; margin: 0 0 0 0; }
	#xxio12 #torikumi h3{ display: block; margin: 0 0 0 0; text-align: center; }
	#xxio12 #torikumi h3 img{ width: 90%; }

	#xxio12 #localfoot{ clear: both; background: #fff11b; padding:40px 0 40px; margin: 0 0 0 0; }
	#xxio12 #localfoot h3{ display: block; margin: 0 0 20px 0; text-align: center; }
	#xxio12 #localfoot h3 img{ width: 64%;  }
	#xxio12 #localfoot .footcopy{ display: block; margin: 0 0 0 0; text-align: center; }
	#xxio12 #localfoot .footcopy img{ width: 51%;  }


}




#xxio12 #osusume #osusume_inner .topic_box01{ margin: 0 0 20px 0; padding: 0 0 0 115px; }
#xxio12 #osusume #osusume_inner .topic_box02{ margin: 0 0 45px 0; padding: 0 0 0 115px; }
#xxio12 #osusume #osusume_inner .topic_box03{ margin: 0 0 0 0; padding: 0 0 0 115px; }
@media screen and (max-width: 767px) {
  #xxio12 #osusume #osusume_inner .topic_box01{ margin: 0 0 20px 0; padding: 0px 15px 0 25px; }
  #xxio12 #osusume #osusume_inner .topic_box02{ margin: 0 0 15px 0; padding: 0px 15px 0 25px; }
  #xxio12 #osusume #osusume_inner .topic_box03{ margin: 0 0 0 0; padding: 0px 15px 0 25px; }
}