@charset "UTF-8";

/* ////////////////////////////////////////
fry
//////////////////////////////////////// */


/* ///////
main
//////// */
#contentAreaInner{
  width: 100%;
}
#fryArea{
  font-size: 12px;
  letter-spacing: 0.1em;
  width: 100%;
}
.fry__innerBlock{
  width: 100%;
  max-width: 640px;
  color: #666666;
  margin: 0 auto;
  position: relative;
}
#fry__Main{
  position: relative;
  background: #fcf3e0;
  padding: 0 0 30px 0;
}
#fry__Main .fry__innerBlock{
  background:url(../img/area2_bg1.png) no-repeat right 20%,url(../img/area2_bg2.png) no-repeat left 60%;
  background-size: 70%;
}
#fry__Main--img{
  padding: 45px 0 0 0;
  position: relative;
}
#fry__Main--img h3{
  margin: 0;
}
#fry__Main--img img{
  vertical-align: bottom;
}
.fry__Main--sns{
  text-align: right;
  position: absolute;
  margin: 0;
  right: 5px;
  top: -15px;
}
.fry__Main--sns li{
  display: inline-block;
  width: 46px;
  height: 46px;
  margin: 0 5px 0 0;
}
#fry__Main--spec{
  max-width: 100%;
  margin: 0 auto;
  padding: 30px 0;
  position: relative;
}
#fry__Main--spec p{
  text-align: center;
  max-width: 640px;
  width: 84%;
  margin: 20px auto 0 auto;
}
#fry__Main--spec p.ttlImg{
  margin: 0px auto 0px auto;
  width: 80%;
}

/* ///////
Detail
//////// */

#fry__Detail{
  position: relative;
  padding: 30px 0;
  background: #fcf3e0;
}



.detailTxt img{
  width: 100%;
  margin: 0 auto;
}
.fry__item--Area{
  width: 84%;
  margin: 0 auto ;
  display:-webkit-box;
  display:-moz-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  justify-content: space-between;
  -webkit-justify-content: space-between;
}
.fry__item--Box{
  width: 100%;
  padding: 5%;
  box-sizing: border-box;
  background: #cc9900;
}

.fry__item--Box:last-child{
  background: #993300;
}
.fry__item--Box img{
  width: 100%;
	margin: 0;
	padding: 0;
	vertical-align: bottom;
}

.detailTxt{
  width: 100%;
  padding:5%;
  font-weight: bold;
  box-sizing: border-box;
  position: relative;
}
.couT{
  padding: 20px 0;
  text-align: center;
  font-size: 12px;
  color: #fff;
}

.detailTxt:after, .detailTxt:before {
	bottom: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.detailTxt:after {
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: #fff;
	border-width: 10px;
	margin-left: -10px;
}
.detailTxt:before {
	border-color: rgba(0, 0, 0, 0);
	border-bottom-color: #;
	border-width: 16px;
	margin-left: -16px;
}

.fry__item--Box .detailTxt{
  background: url(../img/area2_con_bg1.png) no-repeat right center #fff;
  background-size: 50%;
}
.fry__item--Box:last-child .detailTxt{
  background: url(../img/area2_con_bg2.png) no-repeat right center #fff;
  background-size: 50%;
}
.fry__item--Box h4{
  text-align: center;
  margin: 0 0 10px 0;
}
.fry__item--Box h4 img{
  width: 70%;
}
.fry__item--Area .item__Box--txt{
  margin: 10px 0;
}
.fry__item--Area .fryBtn{
  margin: 40px 0;
}
.fry__item--Area .fryBtn a{
  border-radius: 10px;
  padding: 20px 0 15px 0;
  text-align: center;
  display: block;
  background:url(../img/icon_btn.png) no-repeat 92% center #ed7700;
  background-size: 10px;
}

.fry__innerMinBlock{
  width: 84%;
  margin: 0 auto;
}
.fry__innerMinBlock p.ttlImg2{
  margin: 30px 0 10px 0;
  text-align: center;
}
.fry__innerMinBlock p.ttlImg3{
  margin: 10px 0;
  text-align: center;
}
.fry__innerMinBlock p.ttlImg2 img{
  
}
#movBox iframe{
  width: 100%;
  height: 47.3vw;
}

.fry__innerMinBlock h5{
  text-align: center;
  margin: 0 0 10px 0;
}
.fry__hArea{
  display:-webkit-box;
  display:-moz-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  justify-content: space-between;
  -webkit-justify-content: space-between;
}
.fry__hArea--box {
  width: 48%;
  margin: 0 0 20px 0;
}
.fry__hArea--box p{
  margin: 0 0 10px 0;
}
.fry__lead{
  text-align: left;
  font-weight: bold;
  font-size: 14px;
  margin: 10px 0 30px 0;
}
.fry__lead br{
  display: none;
}


.fry__twi--Area{
  background:rgba(170,152,88,0.50);
  border-radius: 10px;
  box-sizing: border-box;
  width: 85%;
  padding: 20px 2%;
  margin: 0 auto 40px auto;
}
.infoArea__infoGrhBg{
  background: #341a0c;
  border-radius: 10px;
  padding: 20px 2%;
}

.fry__twi--Title{
  width: 100%;
  text-align: center;
  margin: 0 auto;
}
.fry__twi--Title h3 img{
  width: 70%;
}
.fry__twi--Btn{
  width: 100%;
  margin: 40px auto;
}
.twiBtn{
  width: 100%;
  margin: 0 0 20px 0;
}
.twiBtn a{
  text-align: center;
  display: block;
  border: 5px solid #fff;
  background:url(../img/icon_btn.png) no-repeat 90% center #00c7ff;
  background-size: 8px;
  border-radius: 20px;
  line-height: 60px;
  font-size: 18px;
  color: #fff!important;
  font-weight: bold!important;
  text-decoration: none!important;
}
.infoArea__infoGrhBg img{
  width: 80%;
  margin: 0 auto;
}
.infoArea__infoGrhCont{
  width: 100%;
  height: auto;
  margin: 0 auto;
}
.infoArea__infoGrhBg{
  text-align: center;
  margin: 0 0 40px 0;
}

#fry__Detail3{
  position: relative;
  
}
#fry__Detail3 .fry__innerBlock{
  width: 84%;
  margin: 0 auto;
  background:url(../img/area3_bg4.png) no-repeat right top #cc3300;
  box-sizing: border-box;
  padding: 30px 5%;
  background-size: 70%;
}
#fry__Detail3::before{
  content: '';
  display: block;
  width: calc((12%) / 2);
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-image: url(../img/bg3.png);
  background-position:calc(100% + 1px) top;
  background-size: 10px;
}
#fry__Detail3::after{
  content: '';
  display: block;
  width: calc((12%) / 2);
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  background-image: url(../img/bg3_r.png);
  background-position:39px top ;
  background-size: 10px;
}
#fry__Detail3 h3 {
  text-align: center;
}
#fry__Detail3 h3 img{
  width: 70%;
}
#Detail3Area{
  text-align: center;
  color: #fff;
}
.bigT{
  font-size: 18px;
  text-align: left;
}
.bigT br{
  display: none;
}
.data{
  width: 100%;
  box-sizing: border-box;
  margin: 40px auto;
  background: #fff;
  border-radius: 100px;
  padding: 10px;
  color: #000;
}
.data img{
  width: 70%;
}
.fry__StepBlock{
  text-align: center;
  margin: 60px auto;
}
.fry__StepBlock h3{
  margin: 30px auto;
}
#fry__Detail3 .fry__StepBlock h3 img{
  width: 50%;
}
.fry__LastBlock{
  width: 84%;
  box-sizing: border-box;
  text-align: center;
  padding: 30px 5%;
  margin: 0 auto;
  background:url(../img/area3_bg5.png) no-repeat left top #f3f3f3;
  background-size: 70%;
}
#fry__Detail3 .fry__LastBlock h3 img{
  width: 60%;
}
#fry__Detail3 .fry__LastBlock h4 img{
  width: 75%;
}
.btnRed {
  width: 100%;
  margin: 40px auto;
}
.btnRed p{
  margin: 0 0 20px 0;
}
.btnRed p a{
  display: block;
  color: #fff;
  
  padding: 20px;
  border-radius: 100px;
  text-decoration: none!important;
  background:url(../img/icon_btn.png) no-repeat 95% center #cc3300;
  background-size: 8px;
}
.fry__LastBlock h3{
  margin: 0 0 20px 0;
}
.fry__LastBlock h4{
  margin: 40px 0 20px 0;
}
.fry__LastBlock .tell{
  font-size: 20px;
  color: #cc3300;
  font-weight: bold;
}

.endTwi p{

  
  width: 100%;
  box-sizing: border-box;
  margin: 40px auto;
  background: #fff;
  border-radius: 100px;
  padding: 10px;
  color: #cc3300;
  text-align: center;
  font-weight: bold;
}

/* ///////
common
//////// */


.btns a{
  display: block;
  text-align: center;
  padding: 20px 0;
  background: #cc3300;
  border-radius: 10px;
  width: 100%;
  margin: 0 auto;
  background:url(../img/icon_bottom_btn.png) no-repeat 90% center #cc3300;
  background-size: 15px;
}
.btns a img{
  height: 20px;
}
.btns.back a{
  display: block;
  text-align: center;
  padding: 20px 0;
  background: #cc3300;
  border-radius: 10px;
 width: 100%;
  margin: 30px auto;
  background:url(../img/icon_btn.png) no-repeat 90% center #cc3300;
  background-size: 8px;
}

img{
  max-width: 100%;
}

#fryArea a{
  -webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
  opacity: 1;
}
#fryArea a:hover{
  opacity: 0.7;
}


.fryBtn{
  max-width: 640px;
  width: 100%;
  margin: 60px auto 0 auto;
  vertical-align: middle;
}
.fryBtn img{
  height: 20px;
}
.fryBtn a{
  border-radius: 10px;
  padding: 20px 0 15px 0;
  text-align: center;
  display: block;
  background:url(../img/icon_btn.png) no-repeat 92% center #ed7700;
  background-size: 10px;
}
#fry__Main::before,#fry__Detail::before{
  content: '';
  display: block;
  width: calc((12%) / 2);
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-image: url(../img/bg1.png);
  background-position:calc(100% + 1px) top;
  background-size: 10px;
  z-index: 10;
}
#fry__Main::after,#fry__Detail::after{
  content: '';
  display: block;
  width: calc((12%) / 2);
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  background-image: url(../img/bg1_r.png);
  background-position:39px top ;
  background-size: 10px;
  z-index: 10;
}
#fry__Detail2{
  position: relative;
  padding: 30px 0;
  background: #fff;
}
#fry__Detail2 .fry__innerBlock{
  background:url(../img/area2_bg3.png) no-repeat right 100%;
  background-size: 70%;
}
#fry__Detail2::before{
  content: '';
  display: block;
  width: calc((12%) / 2);
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-image: url(../img/bg2.png);
  background-position:calc(100% + 1px) top;
  background-size: 10px;
}
#fry__Detail2::after{
  content: '';
  display: block;
  width: calc((12%) / 2);
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  background-image: url(../img/bg2_r.png);
  background-position:39px top ;
  background-size: 10px;
}