@charset "UTF-8";

a	{display:block; padding:3px; color:#555;}
body{font-family:"Roboto",sans-serif;}

.ec3_menu_h{font-family:"Roboto",sans-serif;font-size:3rem;font-weight:400;line-height:1.1;text-align:center;text-indent:.3rem;letter-spacing:.3rem;}
.ecs_title{font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,"HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",メイリオ,Meiryo,serif;}

/*マーキー*/
.marquee-anim {  padding: .3em 0; overflow: hidden;}
.marquee-span { display: inline-block; padding-left: 100%; white-space: nowrap; animation: marquee 10s linear infinite;}
@keyframes marquee {from	{transform: translate(0);} to {transform: translate(-100%);}}

/*========= ナビゲーション ===============*/

#g-nav{	position:fixed; z-index: 999;top:80px; right: -120%; width:100%; height: 100vh;	background:#ddd; transition: all 0.6s;}
#g-nav.panelactive{ right: 0;}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list{/*ナビの数が増えた場合縦スクロール*/
    position: fixed; z-index: 999; width: 100%; height: 100vh; overflow: auto; -webkit-overflow-scrolling: touch;}

/*ナビゲーション*/
#g-nav ul {position: absolute;z-index: 999;top:30%;left:50%;transform: translate(-50%,-50%);}

/*リストのレイアウト設定*/
#g-nav li	{list-style: none; text-align: center;}
#g-nav li a	{color: #333; text-decoration: none; padding:10px;	display: block;	text-transform: uppercase;	letter-spacing: 0.1em;	font-weight: bold;}

/*========= ボタンのためのCSS ===============*/
.openbtn{	position:fixed;    z-index: 9999; top:18px; right: 10px; cursor: pointer; width: 50px; height:50px;}
	
/*×に変化*/	
.openbtn span{	display: inline-block; transition: all .4s; position: absolute;
			    left: 14px; height: 3px; border-radius: 2px; background-color: #666; width: 45%;  }

.openbtn span:nth-of-type(1) {top:15px;}
.openbtn span:nth-of-type(2) {top:23px;}
.openbtn span:nth-of-type(3) {top:31px;}
.openbtn.active span:nth-of-type(1) {top: 18px; left: 18px; transform: translateY(6px) rotate(-45deg); width: 30%;}
.openbtn.active span:nth-of-type(2) {opacity: 0;}
.openbtn.active span:nth-of-type(3)	{top: 30px; left: 18px; transform: translateY(-6px) rotate(45deg); width: 30%;}

/*---------------------------------------------------*/
.ec3_rank-box {position: relative;}
.ec3_rank-img {display: flex;position: absolute;top: 0;left: 0;}
.h1_logo {height:60px;}
.logo_img a:hover	{}

@media only screen and (max-width: 768px) {/*モバイル*/
body	{max-width:100%; overflow:hidden;}
.products_image	{max-width:90%;}
figure.w100 > .products_image{max-width:100%; width:100%}
.button.new_tag.new_tag_list{width:100%;}
.border_l_solid_mobile	{border-left:#dbdbdb 1px solid;}
.border_r_solid_mobile	{border-right:#dbdbdb 1px solid;}
.border_t_solid_mobile	{border-top:#dbdbdb 1px solid;}
.border_b_solid_mobile	{border-bottom:#dbdbdb 1px solid;}
.width70btn_desktop		{width:100%;}
.confirm_box_s			{min-height:3em;}
}

@media only screen and (min-width: 768px) {/*PC*/
.border_l_solid_desktop	{border-left:#dbdbdb 1px solid;}
.border_r_solid_desktop	{border-right:#dbdbdb 1px solid;}
.border_t_solid_desktop	{border-top:#dbdbdb 1px solid;}
.border_b_solid_desktop	{border-bottom:#dbdbdb 1px solid;}
.width70btn_desktop		{min-width:70%;}
.news_content			{line-height:2em;}
.products_image			{max-width:500px !important;}
.menu.border_left_gray	{border-left:#CCC 1px solid; padding-left:10px;}
.confirm_box_s			{min-height:5em;}

.fotter_menu_border{ border-right:#dbdbdb 1px solid;}
.fotter_menu_border_l{ border-left:#dbdbdb 1px solid;}
}
/*---------------------------------------------------*/
.ec2_btn{border-color:#e3d6c9; border-radius:unset; width:100%;}

/*検索キーワードのタグ*/
a.tagborder span.tag{border:#0C9 1px solid;}
a.tagborder span.tag:hover	{}
a.tagborder:hover	{background-color:rgba(200,200,200,.0);}

/*新着商品タグ*/
.new_tag		{border:#333 1px solid; padding:0 3px;}
.button.new_tag.new_tag_list{border-radius: unset; min-width:70%;}
.b-radius_n		{border-radius: unset;}

/*新着情報*/
.news_content	{border-bottom:#dbdbdb 1px dotted;}
.news_content a	{width:100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.news_content a > span	{font-weight:bold;}

/*aside*/
ul.feature_brands li	{text-align:center; border-bottom:#dbdbdb 1px dotted;}
ul.feature_brands li a button.brands_btn{height:80px; border:none;}

/*フッター*/
ul.menu-list li	{list-style:none;}

/*タブ切り替え*/
.tab-contents .content	{display: none;}
.tab-contents .content.is-active {display: block;}

/*moreリスト一定以上*/
.wrapper_more	{display: block;/*  margin: 30px;  width: calc(100% - 60px);*/}
.more_list		{box-sizing: border-box;  list-style: none;}
.more_list li	{margin-bottom: 5px;}
.more_list.close li:nth-child(n + 4){display: none;}

/*画像*/
figure > img:hover	{opacity: 0.5;}
figure.max64	{height:100%; width:64px;max-height:64px;overflow:hidden;}
figure.max100	{height:100%;max-height:100px;overflow:hidden;}
figure.max110	{height:100%;max-height:110px;overflow:hidden;}
figure.max120	{height:100%;max-height:120px;overflow:hidden;}
figure.max130	{height:100%;max-height:130px;overflow:hidden;}
figure.max140	{height:100%;max-height:140px;overflow:hidden;}
figure.max150	{height:100%;max-height:150px;overflow:hidden;}
figure.max160	{height:100%;max-height:160px;overflow:hidden;}
figure.max170	{height:100%;max-height:170px;overflow:hidden;}
figure.max180	{height:100%;max-height:180px;overflow:hidden;}
figure.max190	{height:100%;max-height:190px;overflow:hidden;}
figure.max200	{height:100%;max-height:200px;overflow:hidden;}
figure.max210	{height:100%;max-height:210px;overflow:hidden;}
figure.max220	{height:100%;max-height:220px;overflow:hidden;}
figure.max230	{height:100%;max-height:230px;overflow:hidden;}
figure.max240	{height:100%;max-height:240px;overflow:hidden;}
figure.max250	{height:100%;max-height:250px;overflow:hidden;}
figure.max260	{height:100%;max-height:260px;overflow:hidden;}
figure.max270	{height:100%;max-height:270px;overflow:hidden;}
figure.max280	{height:100%;max-height:280px;overflow:hidden;}
figure.max290	{height:100%;max-height:290px;overflow:hidden;}
figure.max300	{height:100%;max-height:300px;overflow:hidden;}
figure.max310	{height:100%;max-height:310px;overflow:hidden;}
figure.max320	{height:100%;max-height:320px;overflow:hidden;}
figure.max330	{height:100%;max-height:330px;overflow:hidden;}
figure.max340	{height:100%;max-height:340px;overflow:hidden;}
figure.max350	{height:100%;max-height:350px;overflow:hidden;}
.height200		{max-height:200px; width:auto; overflow:hidden;}
@media only screen and (max-width: 768px) {/*モバイル*/
figure.max100-mobile	{height:100%;max-height:100px;overflow:hidden;}
figure.max110-mobile	{height:100%;max-height:110px;overflow:hidden;}
figure.max120-mobile	{height:100%;max-height:120px;overflow:hidden;}
figure.max130-mobile	{height:100%;max-height:130px;overflow:hidden;}
figure.max140-mobile	{height:100%;max-height:140px;overflow:hidden;}
figure.max150-mobile	{height:100%;max-height:150px;overflow:hidden;}
figure.max160-mobile	{height:100%;max-height:160px;overflow:hidden;}
figure.max170-mobile	{height:100%;max-height:170px;overflow:hidden;}
figure.max180-mobile	{height:100%;max-height:180px;overflow:hidden;}
figure.max190-mobile	{height:100%;max-height:190px;overflow:hidden;}
figure.max200-mobile	{height:100%;max-height:200px;overflow:hidden;}
.center150-mobile > img,
.center150-mobile > a > img{object-fit: cover;object-position: 50% 50%; width:150px; height:150px; overflow:hidden;}
}
@media only screen and (min-width: 768px) {/*PC*/
figure.max200-desktop	{height:100%;max-height:200px;overflow:hidden;}
figure.max250-desktop	{height:100%;max-height:250px;overflow:hidden;}
figure.max260-desktop	{height:100%;max-height:260px;overflow:hidden;}
figure.max270-desktop	{height:100%;max-height:270px;overflow:hidden;}
figure.max280-desktop	{height:100%;max-height:280px;overflow:hidden;}
figure.max290-desktop	{height:100%;max-height:290px;overflow:hidden;}
figure.max300-desktop	{height:100%;max-height:300px;overflow:hidden;}
figure.max310-desktop	{height:100%;max-height:310px;overflow:hidden;}
figure.max320-desktop	{height:100%;max-height:320px;overflow:hidden;}
figure.max330-desktop	{height:100%;max-height:330px;overflow:hidden;}
figure.max340-desktop	{height:100%;max-height:340px;overflow:hidden;}
figure.max350-desktop	{height:100%;max-height:350px;overflow:hidden;}
}

.center230 > img,
.center230 > a > img{object-fit: cover;object-position: 50% 50%; width:230px; height:230px; overflow:hidden;}
.center240 > img,
.center240 > a > img{object-fit: cover;object-position: 50% 50%; width:240px; height:240px; overflow:hidden;}
.center150 > img,
.center150 > a > img{object-fit: cover;object-position: 50% 50%; width:150px; height:150px; overflow:hidden;}

@media only screen and (min-width:768px) and (max-width:1200px) {
.center270 > img,
.center270 > a > img{object-fit: cover;object-position: 50% 50%; width:220px; height:220px; overflow:hidden;}
.center270-desktop > img,
.center270-desktop > a > img{object-fit: cover;object-position: 50% 50%; width:220px; height:220px; overflow:hidden;}
}
@media only screen and (min-width: 1201px) {
.center230-desktop > img,
.center230-desktop > a > img{object-fit: cover;object-position: 50% 50%; width:230px; height:230px; overflow:hidden;}
.center240-desktop > img,
.center240-desktop > a > img{object-fit: cover;object-position: 50% 50%; width:240px; height:240px; overflow:hidden;}
.center270-desktop > img,
.center270-desktop > a > img{object-fit: cover;object-position: 50% 50%; width:270px; height:270px; overflow:hidden;}
}




/*スクロールバー*/
.image-horizontal-scroll{overflow-x: auto;white-space: nowrap;-webkit-overflow-scrolling: touch;}
.image-horizontal-scroll::-webkit-scrollbar			{width: 10px; height: 10px;}
.image-horizontal-scroll::-webkit-scrollbar-track	{border-radius: 5px;  box-shadow: 0 0 2px #aaa inset;}
.image-horizontal-scroll::-webkit-scrollbar-thumb	{border-radius: 5px; background: #999;}
.box_scroll		{display: inline-block;}
.column			{overflow-x:auto;}
html, header	{overflow-x: hidden;}

/*confirm*/
.confirm_title	{border-bottom:#dbdbdb 2px solid;}

/*その他*/
hr				{border-width: 1px 0px 0px 0px;border-style: solid;border-color:#dbdbdb;height: 1px; }
.center			{text-align:center;}
.border_solid	{border:#dbdbdb 1px solid;}
.border_b_solid	{border-bottom:#dbdbdb 1px solid;}
.border_b_sol-2	{border-bottom:#dbdbdb 2px solid;}
.border_b_solid_ec2	{border-bottom:#e3d6c9 1px solid;}
.border_t_solid	{border-top:#dbdbdb 1px solid;}
.border_l_solid	{border-left:#dbdbdb 1px solid;}
.border_r_solid	{border-right:#dbdbdb 1px solid;}
.border_b_dot	{border-bottom:#dbdbdb 1px dotted;}
.border_t_dot	{border-top:#dbdbdb 1px dotted;}
.border_b_h		{border-bottom:#333 2px solid;}
.is-buy			{background-color:#bf0000; color:#FFF;border:none;}
.is-buy:hover	{background-color:#cc3333; color:#FFF;border:none;}

.line-through	{text-decoration:line-through;}
.h_title_grey	{border-left:#999 4px solid;}
.text_ellipsis	{text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.over_h			{width:100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.card_box_content{box-shadow:none; border:#ccc 1px solid;}
.select_none	{user-select: none;-moz-user-select: none;-webkit-user-select: none;-ms-user-select: none;}

/*ページ上部へのリンク*/
#page-top a			{background:#CCC;  display: flex;justify-content:center;align-items:center;
					 border-radius: 5px;width: 60px;height: 60px;color: #fff;
				   	 text-align: center;text-transform: uppercase; text-decoration: none;transition:all 0.3s;}
#page-top a:hover	{background: #777;}
#page-top		 	{position: fixed;right: 20px;bottom:20px;z-index: 2;opacity: 0;transform: translateY(100px);}
#page-top.UpMove 	{animation: UpAnime 0.5s forwards;}
@keyframes UpAnime{
  from	{opacity: 0;transform: translateY(100px);}
  to	{opacity: 1; transform: translateY(0);}}
#page-top.DownMove{ animation: DownAnime 0.5s forwards;}
@keyframes DownAnime{
  from	{opacity: 1;transform: translateY(0);}
  to	{opacity: 1;transform: translateY(100px);}}

.page_links > span{white-space: nowrap;}
.page_links > span > a{ display:inline; color:#06C; padding: 1em; margin:1em 0;}

.title_sub {padding: .5em .75em;background-color: #f6f6f6;border-left: 6px solid #ccc;}
.title_sub,
.s_sub_title{font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,"HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",メイリオ,Meiryo,serif;}
.s_sub_title{font-weight:bold; padding-bottom:0.5em; margin:1em 0;border-bottom: solid 3px #f0e1f0;position: relative;}
.s_sub_title:after {position: absolute;content: " ";display: block;border-bottom: solid 3px #cfb9d5;bottom: -3px;width: 20%;}

.settlement_table th{ background-color:#f6f6f6;}
.indent {text-indent:1em;}
.bg_pt{position:relative;background-image:url(/assets/contents_image/holder/p_pt_0229_ss_pt_02290.jpg);
background-repeat:repeat;background-color:#FFFFFF;background-position:0% 100%;padding-top:20px;}
.bg_top_img{ position:absolute; top:0; left:0;width:100%; height:30px; margin-bottom:0; padding-top:0;}

.register_box{border:#CCC 4px solid; width:70%;}
.register_box:hover{border:#a1a1a1 4px solid;}
.image .gacha_img {width: 320px; display: inline-block;}
.br_mobile{ display:none;}
@media only screen and (max-width: 768px) {
.br_mobile{ display:block;}
.register_box{width:90%;}
.fotter_menu_border{ border:none;}
}

/*フッター*/
footer{line-height: normal;font-family:"Roboto",sans-serif;}
footer a{padding:0.5em; margin:0;}
footer a:hover{background-color:#cfb9d5;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all  0.3s ease;}
footer h3{font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,"HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",メイリオ,Meiryo,serif;
position: relative;padding: 1.5rem;text-align: center;}
footer h3:before {position: absolute;bottom: -10px;left: calc(50% - 30px);width: 60px;height: 5px;content: '';border-radius: 3px;}