@charset "UTF-8";

*{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

img {
	width:100%;
	height:auto;
}

article {
	width:100%;
	/*overflow:hidden;*/
}

article p {
	margin:0 4.6875% 0.8em;
}


.pan{
	margin-bottom:0 !important;
}

p.rakutenNumerTxt{
	margin:0 9.375% 0.8em;
}

p.notes{
	margin:-1em 4.6875% 0 ;
	text-align:right;
	font-size:77%;
	line-height:1.2;
}

dd p {
	margin:0.5em 0.5em 1.5em;
}
dd p:last-child {
	margin-bottom:0;
}

.nospace{
	margin:0 0 1.5em;
}
.nospace2{
	margin:0 0 1em;
}

.space{
	margin:0 3.125% 0.5em;
}

.nospace img,
.nospace2 img{
	width:100%;
	height:auto;
}


article h1 {
	text-align: center;
	padding:0.5em 0;
}
article h1 img{
	width:84.3745%;
	margin:0.5em 0;
}


article.old h1{
	margin:0 ;
}
article.old h1 img{
	width:84.3745%;
	margin:0;
}
article.old h2 {
	margin:2em 0 0.5em;
}
article.old p {
	margin:0 4.6875%  1em;
	line-height:1.4;
	font-size:85%;
}

article h2 {
	
}
article h3 {
	margin:1.5em 0;
	text-align:center;
}
article h3 img{
	width:84.375%;
	height:auto;
}


.chkradio {
	padding-left:0 !important;
}


#flow{
	margin-top:-2em;
	padding-top:2em;
}


.spec{
	font-size:93%;
	line-height:1.2;
}
.spec span{
	color:#AB2C92;
}

/*--------------------------------------------------------
　切り替え
--------------------------------------------------------*/

#swichArea{
	width:89.0625%;
	height: auto;
	margin:0 auto 0.5em;
	overflow:hidden;
}
#swichArea span{
	width:55%;
	float:left;
}
#swichArea span img{
	width:100%;
	height:auto;
}

.switch{
	width:108px;
	float:right;
}

.switch input {
	display: none;
}
.switch label{
	display: block;
	float: left;
	cursor: pointer;
	width: 54px;
	height:44px;
	background:url(../../sp_img/order/ico_glid_off.png) no-repeat center center;
	background-size:36px auto;
	margin: 0;
	padding: 10px;
	border:1px solid #999;
	color: #333;
	font-size: 16px;
	text-align: center; line-height: 1;
	transition: .2s;
}

.switch label:first-of-type{
	background: #fff url(../../sp_img/order/ico_glid_on.png) no-repeat center center;
	background-size:36px auto;
	border-radius: 4px 0 0 4px;
}
.switch label:last-of-type{
	background: #fff url(../../sp_img/order/ico_list_on.png) no-repeat center center;
	background-size:36px auto;
	border-radius: 0 4px 4px 0;
}
.switch input[type="radio"]:checked + .switch-on {
	background: #999 url(../../sp_img/order/ico_glid_off.png) no-repeat center center;
	background-size:36px auto;
	color: #333;
}
.switch input[type="radio"]:checked + .switch-off {
	background: #999 url(../../sp_img/order/ico_list_off.png) no-repeat center center;
	background-size:36px auto;
	color: #333;
}


.baloon{
	width:90.625%;
	margin:0 auto 1em;
}


/*--------------------------------------------------------
　注文画面　共通処理
--------------------------------------------------------*/
.Number {
	font-size:116%;
	height:30px; line-height:30px;
	width:98.4375%;
	margin-left:  1.5625%;
	margin-bottom:1em;
	padding: 0 0 0 2.4em;
	overflow: hidden;
	color: #FFF;
	display: block;
	vertical-align: middle;	
	border-radius: 15px 0 0 15px ;
    -webkit-border-radius: 15px 0 0 15px ;
    -moz-border-radius: 15px 0 0 15px ;
	font-weight:bold;
}
.no01 {
	background:url(../../sp_img/order/ico_no1.png) no-repeat 0.5em center, url(../../sp_img/order/white.png) repeat-y 1.8em top;
	background-size: 16px auto, 3px auto;
	text-indent:-0.4em;
}
.no02 {
	background:url(../../sp_img/order/ico_no2.png) no-repeat 0.5em center, url(../../sp_img/order/white.png) repeat-y 1.8em top;
	background-size: 16px auto, 3px auto;
	text-indent:-0.4em;
}
.no03 {
	background:url(../../sp_img/order/ico_no3.png) no-repeat 0.5em center, url(../../sp_img/order/white.png) repeat-y 1.8em top;
	background-size: 16px auto, 3px auto;
	text-indent:-0.4em;
}
.no04 {
	background:url(../../sp_img/order/ico_no4.png) no-repeat 0.5em center, url(../../sp_img/order/white.png) repeat-y 1.8em top;
	background-size: 16px auto, 3px auto;
	text-indent:-0.4em;
}
.no05 {
	background:url(../../sp_img/order/ico_no5.png) no-repeat 0.5em center, url(../../sp_img/order/white.png) repeat-y 1.8em top;
	background-size: 16px auto, 3px auto;
}
.no06 {
	background:url(../../sp_img/order/ico_no6.png) no-repeat 0.5em center, url(../../sp_img/order/white.png) repeat-y 1.8em top;
	background-size: 16px auto, 3px auto;
}
.no07 {
	background:url(../../sp_img/order/ico_no7.png) no-repeat 0.5em center, url(../../sp_img/order/white.png) repeat-y 1.8em top;
	background-size: 16px auto, 3px auto;
}


/*----------------------------------------------------------------------
   商品リスト
----------------------------------------------------------------------*/
dl.nav,
dl.nav2,
dl.nav3,
dl.nav4{
	margin:1.5em auto 2em;
}

dl.nav dt a,
dl.nav2 dt a,
dl.nav3 dt a,
dl.nav4 dt a{
	display:block;
}

dl.nav dt,
dl.nav2 dt{
	width:84.375%;
	background-color:#FFE300;
	background-image:url(../sp_img/order/ico_arrow_down.png) ;
	background-repeat:no-repeat;
	background-position:92% center;
	background-size:20px auto;
	height:45px;
	padding-top:10px;
	margin:0 auto;
	border-radius: 10px ;
    -webkit-border-radius: 10px ;
    -moz-border-radius: 10px ;
	text-align:center;
}
dl.nav3 dt,
dl.nav4 dt{
	width:84.375%;
	background-color:#FFE300;
	background-image:url(../sp_img/order/ico_arrow_down2.png) ;
	background-repeat:no-repeat;
	background-position:92% center;
	background-size:20px auto;
	height:45px;
	padding-top:10px;
	margin:0 auto;
	border-radius: 10px ;
    -webkit-border-radius: 10px ;
    -moz-border-radius: 10px ;
	text-align:center;
}

dl.nav dt img,
dl.nav2 dt img,
dl.nav3 dt img,
dl.nav4 dt img{
	height:25px;
	width:auto;
}

dl.nav dt.hovered,
dl.nav2 dt.hovered{
	background-color:#C9CACA;
	background-image:url(../sp_img/order/ico_arrow_up.png) ;
	background-repeat:no-repeat;
	background-position:92% center;
	background-size:20px auto;
	border-radius: 10px 10px 0 0;
    -webkit-border-radius: 10px 10px 0 0 ;
    -moz-border-radius: 10px 10px 0 0 ;
}
dl.nav3 dt.hovered,
dl.nav4 dt.hovered{
	background-color:#C9CACA;
	background-image:url(../sp_img/order/ico_arrow_up2.png) ;
	background-repeat:no-repeat;
	background-position:92% center;
	background-size:20px auto;
	border-radius: 10px 10px 0 0;
    -webkit-border-radius: 10px 10px 0 0 ;
    -moz-border-radius: 10px 10px 0 0 ;
}

dl.nav dd ul,
dl.nav2 dd ul,
dl.nav3 dd ul,
dl.nav4 dd ul{
	border-top:1px solid #C9CACA;
}
	
dl.nav dd li,
dl.nav2 dd li,
dl.nav3 dd li,
dl.nav4 dd li{
	width:100%;
	height:auto;
	margin:0;
	padding:0;

	border-bottom:1px solid #C9CACA;
}
dl.nav dd li img,
dl.nav2 dd li img,
dl.nav3 dd li img,
dl.nav4 dd li img{
	vertical-align:bottom;
}





/*----------------------------------------------------------------------
   商品リスト
----------------------------------------------------------------------*/
.itemGrid,
.itemList{
	clear:both;
}

.itemGrid .bg,
.itemList .bg{
	background:url(../../../myball/img/choose/bg_dot.gif) repeat ;
	background-size:5% auto;
	padding:0;
	margin:0;
}

.itemGrid input,
.itemList input{
	display: none;
}
.itemGrid label{
	display: inline-block;
	position: relative;
	margin:1em 0 0.5em 1.2em;
	/*padding: 10px 0;*/
	padding: 0 0 0 1.5em;
	border-radius: 2px;
	color: #3e4956;
	text-align: center;
	line-height: 1;
}
.itemGrid label:before,
.itemList label:before{
	position: absolute;
	content: "";
	top: 50%;
	left: -12px;
	width: 24px;
	height: 24px;
	margin-top: -12px;
	background: #fff;
	box-shadow: 0 0 0 1px #999 ;
	border-radius: 50%;
}
.itemGrid input[type="radio"]:checked + label:before,
.itemList input[type="radio"]:checked + label:before {
	background: #999;
}

.itemGrid input[type="radio"]:checked + label:after,
.itemList input[type="radio"]:checked + label:after {
	position: absolute;
	content: "";
	top: 50%;
	left: -4px;
	width: 8px;
	height: 8px;
	margin-top: -4px;
	border-radius: 50%;
	background: #fff;
}


.itemGrid ,
.itemList {
	width:100%;
	margin:0 auto 2em;	
	/*box-shadow:1px 0 0 #B3B3B3 inset,0 1px 0 #B3B3B3 inset ;*/
	border-top: 1px solid #B3B3B3 !important;
	border-left: 1px solid #B3B3B3;
	overflow:hidden;
}
.itemGrid li {
	float:left;
	width: 50%;
	height:100%;
	overflow:hidden;
	padding:1em 2em 0.6em;	
	/*box-shadow:0 -1px 0 0 #B3B3B3 inset,-1px 0 0 #B3B3B3 inset ;*/
	border-right: 1px solid #B3B3B3;
	border-bottom: 1px solid #B3B3B3;
	font-size:100%;
	
}

/*.itemGrid {
	background:url(../../../sp/sp_img/common/dot.png) repeat-y top center;
	background-size:1px auto;
}

ul#item {	
	border:none;
}*/
/*#item li {
	width:45.4%;
	margin:0 0.5em !important;
	padding:1em 1.6em 0.6em;	
	border: 1px solid #B3B3B3;
}*/

.itemGrid li.wide,
.itemList li.wide {
	width:100%;
}

.itemGrid li p{
	text-align: left;
	line-height:1.1;
	margin:0 ;
}
.itemGrid li img,
.itemList li img{
	margin:0 auto;
	display:block;
	width:100%;		
}

.itemList label{
	
	position: relative;
	margin:1em 0 0.4em 0.8em;
	/*padding: 10px 0;*/
	padding: 0 0 0 1.2em;
	border-radius: 2px;
	color: #3e4956;
	text-align: center; line-height: 1;
	display: inline-block;
	vertical-align:middle;
	/*width:50.9375%;*/
	width:45.3125%;
}
.itemList li {
	clear:both;
	float: none;
	width: 100%;
	height:100% !important;
	overflow:hidden;
	padding:1em ;	
	/*box-shadow:0 -1px 0 0 #B3B3B3 inset,-1px 0 0 #B3B3B3 inset ;*/
	border-right: 1px solid #B3B3B3;
	border-bottom: 1px solid #B3B3B3;
	font-size:100%;
}

.itemList li p{
	text-align: left; line-height:1.1;
	margin:0 !important;
}
.itemList li img{
	margin:0 1em 0 0;
	display:block;
	float:left;
	width:30%;
}



.itemGrid li.spaceTop,
.itemList li.spaceTop {
	width:100% !important;
	height: auto !important;
	padding:0 3.125% !important;
	border:none !important;
	background-color:#fff;
}
.itemGrid li.spaceTop img,
.itemList li.spaceTop img{
	width:100%;
}

.itemGrid li.spaceCenter,
.itemList li.spaceCenter {
	width:100% !important;
	height: auto !important;
	padding:1em 3.125% !important;
	border:none !important;
	background-color:#fff;
	margin:0;
	border-bottom: 1px solid #B3B3B3 !important;
}
.itemGrid li.spaceCenter img,
.itemList li.spaceCenter img{
	width:100%;
}

.itemGrid li.space,
.itemList li.space {
	width:100% !important;
	height: auto !important;
	margin:-1px 0 0 !important;
	padding:1em 3.125% 1em !important;
	border:none !important;
	background-color:#fff;
	border-top:1px solid #B3B3B3 !important;
}
.itemGrid li.space img,
.itemList li.space img{
	width:100%;
}

.itemList li.space {
	border-bottom:1px solid #B3B3B3 !important;
}


.space2 {
	width:100% !important;
	height: auto !important;
	margin:0 !important;
	padding:0 3.125% 0.5em !important;
	border:none !important;
	background-color:#fff;	
}
.itemGrid li.space2 img,
.itemList li.space2 img{
	width:100%;
}



/*----------------------------------------------------------------------
   シート選択
----------------------------------------------------------------------*/
select{
	width:84.375%;
	/*-webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;*/
    color: #59595F;
	font-weight:bold;
    height: 44px;
    font-size:123.1%;
	margin:0.5em 7.8125% 1.5em;
    /* padding: 12px 50px 12px 12px;
	border: 1px solid #B3B3B3;
    border-radius: 4px;
    text-indent: .01px;*/
    text-overflow: "";
	
}
/*select{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 270px;
    height: 45px;
	margin:0 7.8125%;
    border: none;
    background: url(../sp_img/order/seal/seal_navi_other.png) no-repeat center center;
    background-size:270px auto;
}*/


dl#seatNav{
	margin-top:2em;
	border-bottom:1px solid #C9CACA;
}

dl#seatNav dt{
	border-top:1px solid #C9CACA;	
	height:21.875%;
	padding:4.6875% 0;
	/*height:70px;
	padding:15px 0;*/
	background-image:url(../sp_img/order/balloon_off.png), url(../../sp_img/order/ico_+.png) ;
	background-repeat:no-repeat, no-repeat  ;
	background-position:1.5625% 15.625% ,95% center;
	background-size:12.8125% auto, 6.5625% auto;
	/*background-size:41px auto, 21px auto;*/
	background-color:#F2F2F2;
	text-align:center;
	position:relative;
}
dl#seatNav dt.hovered{
	background-image:url(../sp_img/order/balloon_on.png), url(../../sp_img/order/ico_-.png)  ;
	background-repeat:no-repeat, no-repeat  ;
	background-position:1.5625% 15.625% ,95% center;	
	background-size:12.8125% auto, 6.5625% auto;
	/*background-size:41px auto, 21px auto;*/
	background-color:#F2F2F2;
}


dl#seatNav dt img.seatT{
	width:64.375%;
}

dl#seatNav dt img.icoSeat{
	width:6.875%;
	position:absolute;
	left:3.125%;
	top:16.25%;
	/*left:10px;
	top:12px;*/
}

dl#seatNav dd{
	text-align:center;
	padding:1.5em 0 2em;
	border-top:1px dashed #C9CACA;
}
dl#seatNav dd img{
	width:68.75%;
}

dl#seatNav dd p{
	width:84.375%;
	margin:0.8em auto 0;
	background:#E4E5E5;
	padding:0.5em 0.5em 0.2em;
	font-size:77%;
	line-height:1.2;
	font-weight:bold;
	color:#BD0000;
	border-radius: 5px ;
    -webkit-border-radius: 5px ;
    -moz-border-radius: 5px ;
}


/*ul#seatNav li{
	border-top:1px solid #C9CACA;
	height:70px;
	padding:15px 0;
	background: url(../sp_img/order/seal/balloon_off.png) no-repeat 0.3em 0.3em, url(../sp_img/order/seal/ico_+.png) no-repeat right 1em center;
	background-size:41px auto, 21px auto;
	text-align:center;
	position:relative;
}
ul#seatNav li img.seatT{
	width:64.375%;
}
ul#seatNav li img.seatT{
	width:64.375%;
}

ul#seatNav li img.icoSeat{
	width:6.875%;
	position:absolute;
	left:10px;
	top:12px;
}*/

/*----------------------------------------------------------------------
  注意
----------------------------------------------------------------------*/

dl.attention,
dl.attention2{
	width:90.625%;
	margin:0 auto 0.5em;
	border:2px solid #F9DC92;
	padding:3px;
	border-radius: 5px ;
    -webkit-border-radius: 5px ;
    -moz-border-radius: 5px ;
}

dl.attention dt,
dl.attention2 dt{

	/*height: 40px;*/
	padding:0.5em 0;	
	background-color:#F9DC92;
	background-image:url(../../sp_img/order/ico_+.png)  ;
	background-repeat:no-repeat;
	background-position:97% /*right 0.8em*/ center;
	background-size: 21px auto;
	text-align:center;
	
	color:#595757;
	font-size:116%;
	font-weight:bold;
	border-radius: 5px ;
    -webkit-border-radius: 5px ;
    -moz-border-radius: 5px ;
}
dl.attention dt.hovered,
dl.attention2 dt.hovered{
	background-color:#F9DC92;
	background-image: url(../../sp_img/order/ico_-.png);
	background-repeat:no-repeat;
	background-position:97% /*right 0.8em*/ center;
	background-size:21px auto;
	
}

dl.attention dd,
dl.attention2 dd{
	padding:0.8em;
	font-size:93%;
}

dl.attention dd hr,
dl.attention2 dd hr{
	border: 0;
    border-bottom:1px dashed #323232;
	margin:1.5em 0;
}

dl.attention dt:nth-child(1),
dl.attention2 dt:nth-child(1){
	text-indent:-1.5em;
}
dl.attention dt:nth-child(2),
dl.attention2 dt:nth-child(2){
	font-size:108% !important;
}
dl.attention dt:nth-child(3){
}


/*----------------------------------------------------------------------
   名前入力
----------------------------------------------------------------------*/
.text_check{
	width:90.625%;
	margin:1.5em auto 0;
}
.text_check p{
	margin:1em 0 0.5em;
}

.text_check input[type="text"]{
	width:100%;
	height: 44px; line-height:44px;
	padding:0.5em;
	font-size:138.5%;
}
.text_check input[type="checkbox"]{
	width:20px;
	height:20px;
	vertical-align:middle;
}

.miyoji{
	font-size:85%;
}


#nameBox{
	margin-top:2em;
	overflow:hidden;
}


#nameBox .pos01,
#nameBox .pos02{
	float:left;
	clear:both;
	overflow:hidden;
}

#nameBox p:first-child{
	margin-bottom:0;
}
#nameBox .pos01 img,
#nameBox .pos02 img{
	width:21.875%;
}

#nameBox input[type="text"]{
	width:75%;
	float:right;
	height: 44px;
	line-height:44px;
	padding:0.5em;
	font-size:138.5%;	
}

.sample{
	clear:both;
	width:90.625%;
	margin:0 auto 0.5em;
}

/*--------------------------------------------------------
　購入数
--------------------------------------------------------*/
.set {
	margin:2em 9.375% 0;
}
.set span {
	font-size:108%;
	font-weight:bold;
	margin-left:0.5em;
	line-height:44px;
}

.set input[type="button"] {
	display: none;
}
.set label{
	display: block;
	float: left;
	cursor: pointer;
	width: 50px;
	height:44px;
	margin: 0 ;
	padding: 12px 5px;
	border: 1px solid #989898;
	background: #bdc3c7;
	color: #555e64;
	font-size: 14px;
	text-align: center;
	line-height: 1;
	transition: .2s;
}

.set label:first-of-type{
	border-radius: 5px 0 0 5px;
	border-right:none;
    background :url(../../sp_img/order/btn_-.png) #eee;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:16px auto, auto;
}
.set label:last-of-type{
	border-radius: 0 5px 5px 0;
	border-left:none;
    background :url(../../sp_img/order/btn_+.png) #eee;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:16px auto, auto;
}


.set input[type="text"] {
	width: 70px;
	padding: 12px 5px;
	height:44px;
	float:left;
	text-align:center;
	font-size:153.9%;
	font-weight:bold;
	border: 1px solid #989898;
	border-radius: 0;
    background: #fff;
}


/*--------------------------------------------------------
　ボタン
--------------------------------------------------------*/

.btn01{
	width:84.375%;
	margin:0 auto 0.8em !important;
}


.btnBlock1 {
	width:84.375%;
	margin:0 auto 4em;
}
.btnBlock1 input[type="image"] {
	width:100%;
	height:auto;	
}

/*----------------------------------------------------------------------
   footer
----------------------------------------------------------------------*/
footer {
	border-top:1px solid #B3B3B3 !important;
}




/*----------------------------------------------------------------------
   reset
----------------------------------------------------------------------*/
.clearfix { 
	zoom:100%;
}

.clearfix:after {
	content:" "; 
	clear:both; 
	height:0; 
	display:block; 
	visibility:hidden;
}

.formError{
	position:absolute;
	left:0 !important;
}