 
hr.sub_hr {height:80px}
hr.sub_hr2 {height:40px}
h3.guide {font-size:1.7em; width:100%; text-align:center; margin:70px 0 30px 0; font-weight:700    }
h3.guide2 {font-size:1.3em; font-weight:600;  width:100%; margin-bottom:15px;  display:flex; align-items:flex-end}
h3.guide2 a {font-size:14px; font-weight:400; margin-left:auto ; }


.sub_in {width:100%; display:inline-block; color:var(--g_color);}
.sub_in img {max-width:100%}

h4.tit {font-size:1.25em; margin-bottom:15px; font-weight:600}
h4.tit.flex  {align-items:center}
h4.tit.flex a {margin-left:auto; font-size:14.3px; font-weight:400; background-color: var(--main_c); color:#fff; display:inline-block; padding:4px 10px}

.sub_menu h3 {font-size:2em; font-weight:800;  margin-top:70px; margin-bottom:70px ;   text-align:center}
.sub_menu ul {display:flex; width:100%; position:relative; margin-bottom:20px;   background-color:#f5f5f5;  }
.sub_menu ul li {width:50%; font-size:1.1em; text-align:center; line-height:35px; padding:5px 20px; position:relative; z-index:99; cursor:pointer}
.sub_menu ul li a {width:100%; display:inline-block}
.sub_menu ul li.on {background-color:var(--main_c); color:#fff}
.sub_menu ul li a {color:#222}
.sub_menu ul li.on a {color:#fff}

.right_con {width:calc(100% - 240px); margin-left:auto; }

.list aside {width:200px; margin-right:40px; flex-shrink:0}
.list aside ul {width:100%}
.list aside ul li {margin-bottom:10px; font-size:1.1em}
.list aside ul li:last-child {margin-bottom:0}
.list aside ul li ul {margin:15px 0; background-color:#fff; border-top:1px solid #ddd; border-bottom:1px solid #ddd; padding:20px 0; box-sizing:border-box}
.list aside ul li a {color:var(--g_color); }
.list aside ul li a:hover {color:var(--main_c); font-weight:600 }
.list aside ul li.ov > a {color:var(--main_c); font-weight:600}
.list aside ul li ul li {margin-bottom:5px; display:flex; font-size:.97rem;  }
.list aside ul li ul li:before {content:'-'; margin-right:3px}
.list aside ul li ul li a {color:#666; font-size:1em}
.list aside ul li ul li a:hover {text-decoration:underline; font-weight:400}
.list aside ul li ul li.ov > a {  font-weight:400}
.list aside.none {display:none}

.list_cate ul {display:flex; flex-wrap:wrap; border:1px solid #ddd; box-sizing:border-box; padding:10px 15px; margin-bottom:15px}
.list_cate ul li { margin:5px 20px 5px 0}
.list_cate ul li a {color:#555}
.list_cate ul li.ov a {font-weight:600; color:#111}
 
@media screen and (max-width:900px){
		 .sub_in {font-size:15px; overflow-x:hidden; }

		h3.guide {margin:40px 0 20px 0; font-size:1.5em; font-weight:600}
		h3.guide2 {font-size:1.5em; width:100%; text-align:center; display:inline-block;   margin:40px 0 30px 0}
		h3.guide2 a {display:none }
		.sub_menu h3 {font-size:1.5em;  font-weight:600;  margin:40px 0 30px 0}
		.sub_hr2 + .box h3.guide2 {margin-top:0}

		.list aside {width:100%; margin:16px 0 20px 0;  font-size:14px; }
		.list aside ul {display:flex; flex-wrap:wrap;  }
		  
		.list aside ul li {margin-right:3vw; white-space:nowrap;  margin-bottom:0;   }
		.list aside ul li span { display:none }
		.list aside ul li.ov {width:100%; order:1; margin-top:15px; padding-top:20px; position:relative}
		.list aside ul li.ov a {font-size:1.5em; white-space:nowrap;   color:#111}
		.list aside ul li.ov  span { display:inline-block; font-weight:400;  margin-left:3px; font-size:15.5px }
		 .list aside ul li.ov:after {width:calc(100vw - 4%); position:absolute; left:-4%;  top:0;  content:''; background-color:#ddd; height:1px}
		 .list aside ul li.ov ul li.ov:after {display:none}


		.list aside ul li ul {margin:0; margin-top:6px;  width:100%;  flex-wrap:nowrap; overflow-x:auto; padding:6px 0;   border:none}
		.list aside ul li.ov ul li {white-space:nowrap; width:auto; order:0; margin:0; padding:3px 0; margin-right:10px}
		.list aside ul li.ov ul li a {font-size:1em; color:#666  }

		.list aside ul li.ov ul li.ov a {color:var(--main_c);  }
		.right_con {width:100%;  }
		.list_cate ul  {margin-top:-15px; margin-bottom:30px}
		.list_cate ul li { margin:3px 15px 3px 0}

		.list aside + .tc_guide {display:none}
		.tc .list aside ul {flex-wrap:nowrap; overflow-x:auto}
		.tc .list aside + .tc_guide {display:inline-block}
		.sub_menu ul li {font-size:1em; line-height:30px}

}


.product_view_top  { width:100%; margin-top:70px }
.product_view_top .in  {display:flex; }
.product_view_top .img {width:45%;  display:flex; align-items:center}
.product_view_top .img  img {width:calc(100% - 70px);  box-sizing:border-box; border:1px solid #ddd;  }
.product_view_top .img ul { width:70px; flex-shrink:0; margin-left:-1px;}
.product_view_top .img ul li { line-height:0;  text-align:center; width:100%}
.product_view_top .img ul li img {border:1px solid #ddd; box-sizing:border-box; width:100%}

.product_view_top .info {width:50%; margin-left:auto}
.product_view_top h4 {font-size:1.6em; font-weight:500;   }
.product_view_top .pay {margin-top:10px;  margin-bottom:20px; font-size:1.2em}

.product_view_top .info  ul {width:100%}
.product_view_top .info  ul li {border-bottom:1px solid #ddd; padding:10px 0; display:flex; align-items:center}
.product_view_top .info  ul li b {width:25%; flex-shrink:0}
.product_view_top .info  ul li select {height:40px}

@media screen and (min-width:900px){
	.product_view_top .img ul li img {border-bottom:none}
	.product_view_top .img ul li:last-child img {border-bottom:1px solid #ddd}

}

@media screen and (max-width:900px){
		.product_view_top  { margin-top:40px }
		.product_view_top .in  {flex-wrap:wrap }
		.product_view_top .info {width:100%; }
		.product_view_top .img {width:100%; flex-wrap:wrap}
		.product_view_top .img  img {width:100%;}
		.product_view_top .img ul {width:100%; display:flex; margin-top:-1px }
		.product_view_top .img ul li {width:16.6666%; }
		.product_view_top .img ul li img {border-right:none}
		.product_view_top .img ul li:last-child img {border-right:1px solid #ddd}
		.product_view_top h4 {font-size:1.3em; margin-top:20px}


}

.cart_btn {width:100%; display:flex; justify-content:space-between; margin-top:20px}
.cart_btn a  {width:35%;  border-radius:3px;  line-height:50px;  background-color:var(--main_c);  color:#fff; font-size:1.1em;  font-weight:400; text-align:center; display:inline-block; transition: background-color 0.1s ease-in; cursor:pointer;   white-space:nowrap;}
.cart_btn span  {width:25%; border-radius:3px;  line-height:50px;  background-color:#f9f9f9;   color:#333; font-size:1.1em;  font-weight:400; text-align:center; display:inline-block; transition: background-color 0.1s ease-in; cursor:pointer; white-space:nowrap;}
.cart_btn a:nth-child(2) {background-color:#333;  }
.cart_btn span.over {background-color:var(--main_c); color:#fff}
.cart_btn span b {font-weight:400}

.cart_btn2 {width:100%;  margin-top:20px}
.cart_btn2 span  {width:100%; line-height:50px;  background-color:#333;   color:#fff; font-size:1.1em;  font-weight:400; text-align:center; display:inline-block; transition: background-color 0.1s ease-in; cursor:pointer;   white-space:nowrap;}

@media screen and (max-width:900px){
	    .cart_btn {gap:10px}
		.cart_btn span   {width:50px;  }
		.cart_btn a   {width:50%}
 


}


.option_plus {width:100%; background-color:#f9f9f9;  margin-top:-1px; box-sizing:border-box;   padding:15px; font-size:.95em }
.option_plus div.flex_in { width:100%; display:flex; align-items:center; margin-top:5px; }
.option_plus div.flex_in p:last-child {  white-space:nowrap; font-size:.90em }
.option_plus  div.flex_in a {background-color:#fff; font-weight:300; font-size:.95em;  width:auto; padding:0; margin:0; color:#555; line-height:1}

.number {border:1px solid #ddd; margin-left:auto; margin-right:10px; width:100px; flex-shrink:0; display:flex;  } 
.number span {width:30px; flex-shrink:0;  background-color:#f1f1f1; font-size:12px; text-align:center; line-height:30px; cursor:pointer}
.number p {width:100%;  text-align:Center; line-height:30px; height:30px; float:left; font-size:15px; background-color:#fff}

 
.cart_div span.btn {cursor:pointer; background-color:var(--main_c); position:fixed; padding:20px;  z-index:9999; bottom:0; left:calc(50% - 550px); color:#fff}
.cart_div .cart_div_section {position:fixed; background-color:#fff; border:1px solid #ddd; width:500px;  z-index:9999; bottom:-100%; left:calc(50% - 550px); transition: 0.3s ease-in-out; box-sizing:border-box }
.cart_div span.btn.active + .cart_div_section {bottom:0}
.close {position:absolute; top:30px; right:30px; color:#333; cursor:pointer}
.cart_div .cart_div_section select {width:100%; margin-top:10px}
.cart_div .product_view_top  {margin-top:0; box-sizing:border-box; padding:30px; padding-top:50px}
.cart_div .product_view_top .info {width:100%; margin-left:0}
.cart_div .product_view_top .cart_btn a {width:49%}
 
 

@media screen and (max-width:1100px) {
		.cart_div span.btn {left:4%}
		.cart_div .cart_div_section  {left:4%}

}


@media screen and (max-width:900px) {
 
		.cart_div .cart_div_section  {width:92%}
		.cart_div .product_view_top {padding-left:20px; padding-right:20px}
		.close {right:20px}

 
 }


.mypage .in {display:flex}
.mypage aside {width:200px; border:1px solid #ddd;  box-sizing:border-box; margin-top:-1px}
.mypage aside div {background-color:var(--main_c); color:#fff;  text-align:center; padding:20px; box-sizing:border-box}
.mypage aside div.flex {padding:0;}
.mypage aside div.flex p {border-top:1px solid rgba(255,255,255,.5); border-right:1px solid rgba(255,255,255,.5); text-align:center; width:50%; padding:15px; font-size:15px}
.mypage aside div.flex p + p {border-right:none}
.mypage aside div  b {width:100%; display:block; margin-bottom:2px; font-size:1.1em}
.mypage aside ul {margin-top:20px; width:80%; margin-left:10%}
.mypage aside ul li {border-bottom:1px solid #ddd; padding-bottom:7px; margin-bottom:7px}
.mypage aside ul li:last-child {border-bottom:none}
.mypage aside ul li a:hover {text-decoration:underline}
.mypage .right_con { margin-top:70px}
.mypage aside ul li h4 {color:var(--main_c); font-weight:600}

.mypage .h3_flex {display:flex; margin-bottom:15px;  align-items:flex-end}
.mypage .h3_flex h3 {width:auto; margin-bottom:0;}
.mypage .h3_flex  p {margin-left:auto}


.m_member_box .box_100 {background-color:var(--main_c); margin-top:30px; color:#fff;  text-align:center; padding:20px; box-sizing:border-box}
.m_member_box .flex { background-color:#fff; color:#111; border:1px solid #ddd; border-top:none;  text-align:center; padding:20px; box-sizing:border-box; padding:0;}
.m_member_box .flex p {  border-right:1px solid #ddd; text-align:center; width:50%; padding:15px; font-size:15px; box-sizing:border-box}
.m_member_box .flex p + p {border-right:none}
.m_member_box  b {width:100%; display:block; margin-bottom:2px; font-size:1.1em}

 

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

		.number {  width:90px; } 
		.number span {width:27px; line-height:27px }
		.number p { line-height:27px; height:27px;  }

		.mypage .in {flex-wrap:wrap}
		.mypage aside { display:none}
		.mypage .right_con { width:100%; margin-top:0}
		.mypage ul.m {margin-top:60px}

		.mypage .h3_flex {flex-wrap:wrap}
		.mypage .h3_flex h3 {width:100%; margin-bottom:20px}
		.mypage .h3_flex  p {margin-left:0}
 
 
 }


.mypage ul.product_list li h4  {font-size:1.05em; font-weight:400; margin-top:8px; margin-bottom:0}

.mypage .box + .box {margin-top:20px}

.coupon_send {display:flex; align-items:center; justify-content:center; gap:10px }
.coupon_send input {border:1px solid #cecece;   height:36px; font-size:.97em; padding:0 10px; width:250px;   border-radius:2px}
.coupon_send a.s_btn {background-color:var(--main_c); color:#fff; width:100px; flex-shrink:0}

.calender_search {display:flex; align-items:center; justify-content:center }
.calender_search input {border:1px solid #cecece; height:32px; font-size:.97em; padding:0 10px;  border-radius:2px}
.calender_search a {display:inline-block; background-color:#fff;  border:1px solid #ddd; margin-left:5px; line-height:32px; font-size:.97em; padding:0 10px; border-radius:2px; }
.calender_search a:last-child {margin-left:13px; background-color:var(--main_c); color:#fff; border:1px solid var(--main_c) }


.event {width:100%; display:flex; gap:20px 0; flex-wrap:wrap; justify-content:space-between;}
.event li {width:49%; cursor:pointer}
.event li img {width:100%}
.event li h4 {margin-top:15px; margin-bottom:5px;  font-size:1.23em}
.event li p {font-size:1em; color:#333}
.event li div.img {position:relative}
.event li div.img span.label  {display:inline-block;  font-size:17px; font-weight:400;  border-radius:0;   padding:8px 25px;   position:absolute; right:0; top:0;  background-color:var(--main_c); color:#fff}

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

		.coupon_send input {width:calc(100% - 80px)}
		.coupon_send a.s_btn {  width:80px; }

		
		.calender_search {flex-wrap:wrap;}
		.calender_search.bg_box2 {padding:15px 10px; border:none; background-color:#f1f1f1}
		.calender_search input {  height:30px;   padding:0 5px; width:40%; margin-bottom:5px }
		.calender_search a {margin:0 2px;  padding:0 9px; line-height:30px; font-size:13.5px}
		.calender_search a:last-child {margin-left:2px;   }

		.event {gap:0}
		.event li {width:100%}
		.event li:nth-child(n+2) {margin-top:20px}
		.event li h4 {margin-top:10px; font-size:1.13em}

}
 
 

 
.frame {
	 width:100%; 
	 height:46px; 
	 position:relative; 
	 
	box-sizing:border-box;

}
.frame:after {width:100vw; height:1px; background-color:#ddd; content:'';  position:absolute; left:-4%; top:46px}
.frame ul {
	list-style: none;
	margin: 0;
	height: 100%;  
	
	
 }
.frame ul li { float:left;
	padding:13px 10px;
    font-size:1.05em;
	color: #555;
	text-align: center;
	cursor: pointer;
}

.topmenu ul li ul li ul li, .activetop>a {color:#000; font-weight: 700;}
.topmenu ul li ul li ul li, .activetop>a:after {content: ""; display: block; width:100%; }

.frame.type2 button {position:absolute; top:0; height:100%; z-index:99; color:#333;  background-color:#fff; text-align:right; width:6%; font-size:17px; left:-4% }
.frame.type2 button:last-child { text-align:left; left:auto; right:-4% }
.frame.type2 ul li:first-child {padding-left:2.5%}
.frame.type2 ul li:last-child {padding-right:4%}