@charset "UTF-8";



/*** CSS Document ********************************************



	custom.css



*************************************************************/

/*      LP      */

#pickupWrapper{

	background-color: #005d7f;

	padding: 10px 0;

}

#pickupWrapper h3{

	color: #FFF;

	text-align: center;

	font-size: 110%;

	font-weight: bold;

}

#pickUp{

	margin: 10px auto 0;

}

#pickUp li{

	margin: 0 10px;

	background-color: #FFF;

	padding: 10px;

	border-bottom: 1px solid #005d7f;

	background-image: url(../img/arrow.png);

	background-position: 99%;

	background-repeat: no-repeat;

	background-size: 2%;

}





.adbnr{

	background-color: #005d7f;

	padding: 0px 0;

}

.adbnr h3{

	color: #FFF;

	text-align: center;

	font-size: 110%;

	font-weight: bold;

}

.adbnr ul{

	margin: 10px auto 0;

}

.adbnr ul li{

	margin: 0 10px;

	background-color: #FFF;

	padding: 10px;

	border-bottom: 1px solid #005d7f;

	background-image: url(../img/arrow.png);

	background-position: 99%;

	background-repeat: no-repeat;

	background-size: 2%;

}


#contetns a{
	color: #444;
}


.contStatic img{

	max-width: 100%;

	display: block;

	margin: 0 auto;

}

.section_box{

	padding : 20px 10px 0 10px;

	box-sizing: border-box;

}



.area{

	background-color: #005d7f;

	padding: 10px 0 20px 0;

}



.area h2{

	color: #FFF;

	text-align: center;

	padding-bottom: 10px;

}

.area h2 .h2_tit{

	font-size: 160%;

	font-weight: bold;

}

.area h2{

	font-weight: normal;

	font-size: 80%;

}



.top_text{

	padding-bottom: 7px;

}



.nav{

	background-color: #f4f4f4;

	background-image: url(../img/border.png), url(../img/border.png);

	background-repeat: repeat-x;

	background-position: top, bottom;

}

.nav ul{

	margin: 10px auto 0;

	padding: 10px 0;

	text-align: center;

}

.nav ul li{

	display: inline-block;

	padding: 15px 10px;

	width: 30%;

	margin: 0 auto;

}

.nav ul li img{

}



.section_box h3{

	padding: 10px 0;

}



.pt{

	transform: rotate( -5deg );

    width: 80%;

    margin: 30px auto;

  text-align: center;

}

.pt_02{

	transform: rotate( 5deg );

    width: 80%;

    margin: 30px auto;

  text-align: center;

}

.div_box h4, .div_box_02 h4{

	background-color: #f4f4f4;

	background-repeat: no-repeat;

	background-position: 3% 50%;

	background-size: 10%;

	padding: 15px 20px 15px 70px;

	line-height: 1.5em;

	font-size: 100%;

	font-weight: normal;

	margin: 20px 0;

}



#sorting .div_box h4, #sorting .div_box_02 h4{

		background-image: url(../img/point_red.png);

  background-size: 40px 40px;

}

.div_box h4 p, .div_box_02 h4 p{

	font-size: 140%;

	font-weight: bold;

}



/***  アコーディオン  ***/



.accordion {

	margin: 0 auto;

	text-align:center;

	font-size: 120%;

	font-weight: bold;

}

.accordion:last-child{

	

}

.accordion .ac-content {

}

.accordion input, .accordion_02 input{

	display: none;

}

.accordion a, .accordion_02 a{

	display: block;

	background-position: 99%;

	background-repeat: no-repeat;

	background-color: #f4f4f4;

	cursor: pointer;

	padding: 15px 10px;

	margin: 5px 0 0 0;

		

}

#sorting .accordion a, #sorting .accordion_02 a{

	border: 2px solid #e72a10;

	background-image: url(../img/arrow_red.png);

}

.accordion label:hover {

	

}

.ac-cont ul li{

		background: url(../img/arrow.png) no-repeat 99%;

		background-size: 2%;

}

#sorting .ac-cont ul li{

		border-bottom: 1px solid #e72a10;

		border-left: 2px solid #e72a10;

		border-right: 2px solid #e72a10;

}

#sorting .ac-cont ul li:last-child{

	border-bottom: 2px solid #e72a10;

}

.ac-cont ul li a{

	display: block;

	padding: 10px 0;

	color: #000;

	font-weight: normal;

	font-size: medium;

}

.accordion .ac-cont, .accordion_02 .ac-cont {

	transition: 0.2s;

	height: 0;

	overflow: hidden;

	text-align: center;

}

.accordion input:checked + .ac-cont, .accordion_02 input:checked + .ac-cont {

	height: auto;

}



.accordion_02 {

	text-align:center;

	font-size: 120%;

	font-weight: bold;

}

.accordion_02:last-child{

}



/***  アコーディオン  ***/



/***  吹き出し  ***/

.arrow_box {

	position: relative;

	background: #FFF;

	

}

#sorting .arrow_box {

	border: 2px solid #e72a10;

}

.arrow_box:after, .arrow_box:before {

	top: 100%;

	left: 50%;

	border: solid transparent;

	content: " ";

	height: 0;

	width: 0;

	position: absolute;

	pointer-events: none;

}



.arrow_box:after {

	border-color: rgba(255, 255, 255, 0);

	border-top-color: #FFF;

	border-width: 10px;

	margin-left: -10px;

}

.arrow_box:before {

	border-color: rgba(231, 42, 16, 0);



	border-width: 13px;

	margin-left: -13px;

}

#sorting .arrow_box:before{

	border-top-color: #e72a10;

}



/***  吹き出し  ***/

.graf dl{

	margin: 20px 0;

}



.graf dl dt{

	padding: 15px 35px 15px 35px;

	text-align: center;

	background-size: 7%;

	font-size: 120%;

	font-weight: bold;

}

#sorting .graf dl dt{

	background: url(../img/q_red.png) no-repeat 2% 50%;

	

}

.graf dl dd img{

	margin: 30px auto;

	display:block;

}

.dl_textbox{

	

	padding: 20px;

}

#sorting .dl_textbox{

	border: 2px dashed #e72a10;

}

.dl_textbox dt{

	font-size: 130%;

	font-weight: bold;

	padding-bottom: 10px;

}

#sorting .dl_textbox dt{

	color: #e72a10;

}

.dl_textbox dd{

	line-height: 1.3em;

}



.good dl{

	text-align: center;

	margin-top: 20px;

	

}



.good dl dd img{

	display: block;

	margin: -45px auto;

}



.good dl dd{

  display: inline-block;

  vertical-align: middle;

  width: 45%;

  padding: 9px 0;

  margin: 20px 2px 20px 3px;

  height: 80px;

}



.good dl dd:last-child{

}

.good dl dd p{

  position: absolute;

  top: 55%;

  left: 50%;

  -webkit-transform: translate(-50%, -50%); /* Safari用 */

  transform: translate(-50%, -50%);

  width: 140px;

  

}

.good .p_text{

	font-size: 140%;

	text-align: center;

	font-weight: bold;

	line-height: 1.3em;

	padding: 20px 0;

}



.pr_area ul li{

	margin: 20px 0 10px 0;

	text-align: center;

}



.pr_area ul li:last-child{

	margin: 20px 0 30px 0;

	

}

/***  青ver  ***/

#delivery .div_box h4, #delivery .div_box_02 h4{

		background-image: url(../img/point_blue.png);

  background-size: 40px 40px;

}



#delivery .accordion a, #delivery .accordion_02 a{

	border: 2px solid #175a7a;

	background-image: url(../img/arrow_blue.png);

}

#delivery .ac-cont ul li{

		border-bottom: 1px solid #175a7a;

		border-left: 2px solid #175a7a;

		border-right: 2px solid #175a7a;

}

#delivery .ac-cont ul li:last-child{

	border-bottom: 2px solid #175a7a;

}

#delivery .arrow_box {

	border: 2px solid #175a7a;

}

#delivery .arrow_box:before{

	border-top-color: #175a7a;

}

#delivery .dl_textbox{

	border: 2px dashed  #175a7a;

}

#delivery .dl_textbox dt{

	color:  #175a7a;

}

#delivery .graf dl dt{

	background: url(../img/q_blue.png) no-repeat 2% 50%;

}



/***  青ver  ***/







/* エリアから探す */

#area{

  padding: 20px;

}

#area section dl{

  width: 48%;

  background:#D73635;

  border-radius: 5px;

  float: left;

  padding: 5px;

  box-sizing: border-box;

  margin: 0 1% 2% 1%;

}

#area section dl:nth-child(2n+1){

  clear:both;

}

#area section dl dt{

  font-size: 18px;

  padding: 10px 0;

  text-align: center;

  color: #fff;

}

#area section dl dd{

  display: none;

}

#area section dl dd ul li{

  width: 100%;

  margin: 0 0 2% 0;

}

#area section dl dd ul li a{

  display: block;

  color: #fff;

  border-radius: 5px;

  background: url(../img/arrow_w.png) no-repeat 98% center rgba(255,255,255,0);

  border:solid 2px #fff;

  font-size: 14px;

  text-align: center;

  padding: 10px 0;

}





.areamenu dd{

  display: none;

}



.areabox:after{

  clear: both;

  content: "";

  display: block;

  height: 0px;

  font-size: 0;

  visibility: hidden;

}



.areabox .accordion {

  width: 40%;

  float: left;

  margin: 0 0 20px 7%;

}

.areabox .accordion:nth-child(2n+1){

  clear: both;

}

.areabox .accordion > li p {

  display: block;

  padding: 20px;

}

.areabox .accordion > li {

  cursor: pointer;

  text-align: center;

  background-color: #D73635;

  color: #fff;

  border-radius: 5px;

}



.areabox .accordion > li a{

  padding: 15px 10px;

  display: block;

  color: #fff;

  text-decoration: none;

}



.areabox .right {

  margin: 0 0 20px 0 !important;

}



.areabox ul li ul {

  display: none;

  color: #333;

  border-top: 2px solid #fff;

}

.areabox ul li ul li {

  border-bottom: 2px solid #fff;

  text-align: center;

}

.areabox ul li ul li:last-child {

  border-bottom: none;

}


/*/////▼ モーダル内リンク ▼////*/
.popup h2,
.popup_blue h2{
	font-size: 24px;
	font-weight: lighter;
	line-height: 1.5;
	padding: 0 0 20px 0;
}
.popup section dl{
	width: 100%;
	height: auto;
	background: #cf0915;
	border-radius: 5px;
	float: left;
	padding: 10px 0;
	box-sizing: border-box;
	margin: 0 0 2% 0;
}
.popup_blue section dl{
	width: 100%;
	height: auto;
	background: #175a7a;
	border-radius: 5px;
	float: left;
	padding: 10px 0;
	box-sizing: border-box;
	margin: 0 0 2% 0;
}
.popup section dl dt,
.popup_blue section dl dt{
	font-size: 18px;
	color: #fff;
	font-weight: lighter;
	padding: 0 0 10px 0;
	text-align: center;
}
.popup section dl dd ul li,
.popup_blue section dl dd ul li{
	width: 30%;
	float: left;
	margin: 0 1% 2% 2%;
}
.popup section dl dd ul li a,
.popup_blue section dl dd ul li a{
	display: block;
	color: #444;
	border-radius: 5px;
	background: url(../img/arrow.png) no-repeat 98% center #fff;
	background-size:auto 12px;
	font-size: 14px;
	text-align: center;
	padding: 15px 0;
}










