/* clearfix
------------------------------------------*/
.clear{ clear: both; }
.clearfix{ zoom: 1; }
.clearfix:after{ content: ''; display: table; clear: both; }

/* base
------------------------------------------*/
*, *:before, *:after{
	outline: none;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
html{
	font-size: 62.5%;
}
body, th, td, h1, h2, h3, h4, h5, h6, table, td, th, input, textarea, select, label, button{
	color: #1c1c1c;
	font-size: 1.5rem;
	font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Helvetica', 'Arial', 'YuGothic', 'Yu Gothic', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif;
	font-weight: normal;
	font-feature-settings: 'palt';
	line-height: 1.6;
	letter-spacing: 0.05em;
	word-break: break-all;
	word-wrap: break-word;
}
h1, h2, h3, h4, h5, h6{
	font-weight: bold;
	line-height: 1.3;
}
a, button{
	color: #ed4685;
	text-decoration: none;
	transition: all 0.2s linear;
	user-select: none;
}
.default a:hover,
.default button:hover{
	opacity: 0.7;
}

ul, ol{ list-style: none; }	
img{ max-width: 100%; height: auto; vertical-align: middle; backface-visibility: hidden; transition: all 0.2s linear; }
::-moz-focus-inner{ padding: 0; border: 0; }
:placeholder-shown { color: #bbb; }
::-webkit-input-placeholder{ color: #bbb; }
::-moz-placeholder{ color: #bbb; }
:-moz-placeholder{ color: #bbb; }
:-ms-input-placeholder{ color: #bbb; }

.serif{
	font-family: 'Times New Roman', 'YuMincho', 'Yu Mincho', 'Hiragino Mincho ProN', 'MS PMincho', serif;
}

/* js
------------------------------------------*/
body.fixed{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
}
#loading{
	z-index: 9999;
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.8);
}
#loading:after{
	content: '\f110';
	display: block;
	position: fixed;
	top: 50%;
	left: 0;
	margin: -50px 0 0 0;
	width: 100%;
	height: 100px;
	color: #888;
	font-size: 4.0rem;
	font-family: FontAwesome;
	text-align: center;
	line-height: 100px;
	animation: 3s linear infinite rotation;
}
@keyframes rotation{
	0%{ transform: rotate(0); }
	100%{ transform: rotate(360deg); }
}

/* eccube
------------------------------------------*/
.bg-load-overlay{
	background: rgba(255, 255, 255, 0.4);
	box-sizing: border-box;
	position: fixed;
	display: flex;
	flex-flow: column nowrap;
	align-items: center;
	justify-content: space-around;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 2147483647;
	opacity: 1;
}

/* Btn */
.ec-inlineBtn--cancel,
.ec-inlineBtn--action,
.ec-inlineBtn,
.ec-blockBtn--cancel,
.ec-blockBtn--action,
.ec-blockBtn{
	cursor: pointer;
	display: block;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 50px;
	color: #fff;
	font-size: 1.5rem;
	font-weight: bold;
	text-align: center;
	line-height: 50px;
	background: #555;
	border: #555 1px solid;
	border-radius: 3px;
}
.ec-inlineBtn{
	padding: 0 30px;
	width: auto;
	height: 44px;
	line-height: 44px;
}
.ec-inlineBtn--cancel,
.ec-inlineBtn--action,
.ec-inlineBtn{
	display: inline-block;
	padding: 0 20px;
	width: auto;
	font-size: 1.3rem;
}
.ec-inlineBtn--action,
.ec-blockBtn--action,
.ec-blockBtn{
	background: #e56161;
	border: #e56161 1px solid;
}
.default .ec-blockBtn--action:disabled{
	opacity: 0.7;
}
.ec-blockBtn--action + .ec-blockBtn--cancel,
.ec-blockBtn{
	margin: 10px 0 0 0;
}

input[type="text"],
input[type="number"],
input[type="email"],
input[type="password"],
textarea{
	display: block;
	padding: 0 10px;
	width: 100%;
	height: 44px;
	background: #fff;
	border: #ddd 1px solid;
	border-radius: 3px;
	transition: all 0.2s linear;
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
}
input[type="text"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
textarea:focus{
	background: #fff;
	border: #aaa 1px solid;
}
textarea{
	padding: 10px;
	height: 200px;
}
.ec-select select,
.ec-birth select{
	padding: 0 25px 0 10px;
	height: 44px;
	color: #333;
	font-size: 1.5rem;
	line-height: 44px;
	background:
		linear-gradient(45deg, transparent 50%, #333 50%) no-repeat center right 14px/4px 4px,
		linear-gradient(-45deg, transparent 50%, #333 50%) no-repeat center right 10px/4px 4px;
	background-color: #fff;
	border: #ddd 1px solid;
	border-radius: 3px;
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
}
.ec-checkbox input,
.ec-radio input{
	position: relative;
	top: -2px;
}
.ec-checkbox label,
.ec-radio label{
	margin: 0 15px 0 0;
}
.ec-halfInput{
	display: flex;
	flex-wrap: wrap;
}
.ec-halfInputItem{
	margin: 0 10px 0 0;
	width: 40%;
}
.ec-halfInput input{
	margin: 0 10px 0 0;
	width: 40%;
}
.ec-halfInputItem input{
	width: 100%;
}
.ec-halfInput span input{
	width: 90%;
}
.ec-zipInput{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 0 0 10px 0;
	width: auto;
}
.ec-zipInput input{
	width: 120px;
}
.ec-zipInput + .ec-select,
.ec-select + .ec-input,
.ec-input + .ec-input{
	margin: 10px 0 0 0;
}
.error input[type="text"],
.error input[type="number"],
.error input[type="email"],
.error input[type="password"],
.error textarea,
.error select{
	border: #e56161 1px solid;
	background-color: #fff3f3;
}
.ec-errorMessage{
	width: 100%;
	color: #e56161;
	font-size: 1.3rem;
}

/* .ec-modal */
.ec-modal .checkbox{
	display: none;
}
.ec-modal .ec-modal-overlay{
	z-index: -100;
	opacity: 0;
	display: flex;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.8);
	transition: all 0.2s linear;
}
.ec-modal .ec-modal-wrap{
	align-self: center;
	width: 500px;
	max-width: 90%;
	margin: 0 auto;
	padding: 40px 25px;
	text-align: center;
	background: #fff;
	border-radius: 3px;
	box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.12);
	transition: all 0.2s linear;
}
.ec-modal .ec-modal-wrap .ec-modal-box{
	margin: 20px 0 0 0;
	text-align: center;
}
.ec-modal .ec-modal-wrap .ec-modal-box label{
	transition: all 0.2s linear;
}
.ec-modal .ec-modal-overlay .ec-modal-close{
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 0;
}
.ec-modal .ec-modal-overlay .ec-modal-close span{
	display: block;
	width: 40px;
	height: 40px;
}
.ec-modal .ec-modal-overlay .ec-modal-close span:before,
.ec-modal .ec-modal-overlay .ec-modal-close span:after{
	content: '';
	display: block;
	position: absolute;
	top: 19px;
	left: 10px;
	width: 20px;
	height: 2px;
	background: #555;
	transform: rotate(45deg);
	border-radius: 1px;
}
.ec-modal .ec-modal-overlay .ec-modal-close span:after{
	transform: rotate(135deg);
}
.ec-modal .ec-modal-overlay-close{
	cursor: pointer;
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.ec-modal input:checked ~ .ec-modal-overlay{
	z-index: 9997;
	opacity: 1;
	overflow: auto;
	transform: scale(1);
}
.ec-modal input:checked ~ .ec-modal-overlay .ec-modal-overlay-close{
	display: block;
}
.ec-modal input:checked ~ .ec-modal-overlay .ec-modal-wrap{
	z-index: 9999;
	transform: translateY(0);
}

/* Layout
------------------------------------------*/
.container{
}
.main{
	margin: 0 auto;
	padding: 0 20px;
	max-width: 1320px;
}
.front_page .main{
	max-width: 100%;
	padding: 0;
}

/* header
------------------------------------------*/
.header{
	display: block;
}
.front_page .header{
}
.site-description{
	height: 20px;
	line-height: 20px;
	padding: 0 calc(50vw - 640px);
	background: #f496c0;
	font-size: 1.2rem;
	color: #fff;
}

.header-inner{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 auto;
	padding: 16px 20px;
	max-width: 1320px;
}
.header .logo{
	flex: 0 0 271px;
}
.header-nav{
	display: flex;
}
.header-nav .header-form{
	position: relative;
	margin: 0 20px 0 0;
	padding: 0 10px;
	width: 296px;
	height: 42px;
	border: 2px solid #1c1c1c;
	border-radius: 21px;
}
.header-nav .header-form input{
	width: 270px;
	height: 38px;
	line-height: 38px;
	background: none;
	border: none;
	appearance: none;
}
.header-nav .header-form button{
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 10px;
	font-size: 2.0rem;
	line-height: 38px;
	background: none;
	border: none;
	color: #1c1c1c;
}
.header-nav .header-mymenu{
	position: relative;
	margin: 0 0 0 20px;
}
.header-nav .header-mymenu div{
	cursor: pointer;
	height: 44px;
	font-size: 2.0rem;
	line-height: 44px;
	user-select: none;
}
.header-nav .header-mymenu div .fa{
	margin: 0 8px 0 0;
}
.header-nav .header-mymenu div span{
	font-size: 1.5rem;
}
.header-nav .header-mymenu ul{
	z-index: 10;
	opacity: 0;
	visibility: hidden;
	position: absolute;
	top: 60px;
	left: 50%;
	padding: 20px;
	background: #555;
	border-radius: 3px;
	box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.12);
	transform: translateX(-50%);
	transition: all 0.2s ease;
}
.header-nav .header-mymenu ul.open{
	opacity: 1;
	visibility: visible;
	top: 50px;
}
.header-nav .header-mymenu ul:before{
	content: '';
	position: absolute;
	top: -8px;
	left: 50%;
	border-color: transparent transparent #555 transparent;
	border-width: 0 4px 8px 4px;
	border-style: solid;
	transform: translateX(-50%);
}
.header-nav .header-mymenu ul li{
	text-align: left;
}
.header-nav .header-mymenu ul li a{
	display: block;
	padding: 5px 0;
	width: 120px;
	color: #fff;
}
.header-nav .header-cart{
	position: relative;
}
.header-nav .header-cart a,
.header-nav .header-entry a,
.header-nav .header-login a{
	display: block;
	margin: 0 10px;
	height: 44px;
	line-height: 44px;
	font-size: 1.2rem;
	line-height: 1.5;
	text-align: center;
	color: #1c1c1c;
}
.header-nav .header-cart i,
.header-nav .header-entry i,
.header-nav .header-login i{
	display: block;
	font-size: 2.4rem;
}

.header-nav .header-cart span{
	position: absolute;
	top: -10px;
	right: 5px;
	padding: 0 3px;
	min-width: 18px;
	height: 18px;
	color: #fff;
	font-size: 1.1rem;
	line-height: 18px;
	text-align: center;
	background: #e56161;
	border-radius: 20px;
}
.gnav{
	position: relative;
	padding: 0 calc(50vw - 640px);
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4;
}
.gnav > ul{
	display: grid;
	grid-template-columns: repeat(6, 1fr);
}
.gnav > ul > li{
	/* position: relative; */
}
.gnav > ul > li > a{
	display: block;
	height: 51px;
	line-height: 51px;
	text-align: center;
	font-size: 1.6rem;
	font-weight: bold;
	color: inherit;
}
.gnav > ul > li:nth-child(-n + 2) > a::before{
	content: '\f0c9';
	margin: 0 5px 0 0;
	font-family: FontAwesome;
	color: #f496c0;
}
.gnav ul.child{
	visibility: hidden;
	opacity: 0;
	position: absolute;
	top: 100%;
	left: 0;
	/* padding: 15px; */
	padding: 15px calc(50vw - 640px);
	width: 100%;
	background: #fff;
	box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.12);
	transition: all 0.2s ease;
	z-index: 1;
}
.gnav > ul > li:nth-child(2) > ul{
	padding-left: calc(50vw - 640px + 210px);
}
@media screen and (max-width: 1280px){
.gnav > ul > li:nth-child(2) > ul{
	padding-left: 17%;
}
}
.gnav ul.child.open{
	visibility: visible;
	opacity: 1;
	z-index: 100;
	/* top: 100%; */
}


.gnav ul.child > li > a{
	display: block;
	color: inherit;
}
.gnav ul.child > li > a:before{
	content: '\f105';
	margin: 0 5px 0 0;
	font-family: FontAwesome;
	color: #f496c0;
}
.gnav ul.child > li > ul{
	padding: 5px 5px 5px 20px;
}
.gnav ul.child > li > ul > li > a{
	display: block;
	padding: 3px 0;
	font-size: 1.3rem;
}

.sp-header{
	display: none;
}
.sp-header-inner{
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 20px 15px;
	border-top: 5px solid #f496c0;
}
.drawer-btn{
	position: relative;
	width: 44px;
	height: 44px;
}
.drawer-btn span,
.drawer-btn:before,
.drawer-btn:after{
	content: '';
	display: block;
	position: absolute;
	top: 21px;
	left: 14px;
	width: 16px;
	height: 2px;
	background: #555;
	border-radius: 1px;
}
.drawer-btn:before{
	top: 16px;
}
.drawer-btn:after{
	top: 26px;
}
.sp-header-logo{
	width: calc(100% - 88px);
	text-align: center;
}
.sp-header-logo img{
	width: 180px;
}
.sp-header-cart{
	position: relative;
}
.sp-header-cart a{
	display: block;
	width: 44px;
	height: 44px;
	font-size: 2.0rem;
	line-height: 44px;
	text-align: center;
}
.sp-header-cart span{
	position: absolute;
	top: 2px;
	right: 0;
	padding: 0 3px;
	min-width: 18px;
	height: 18px;
	color: #fff;
	font-size: 1.1rem;
	line-height: 18px;
	text-align: center;
	background: #e56161;
	border-radius: 20px;
}

/* drawer
------------------------------------------*/
.drawer-bg{
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.8);
	transition: all 0.2s ease;
	z-index: 9998;
}
.drawer-bg.open{
	opacity: 1;
	visibility: visible;
}
.drawer-close{
	cursor: pointer;
	display: block;
	position: fixed;
	top: 30px;
	left: 0;
	width: 80%;
	max-width: 300px;
	height: 40px;
}
.drawer-close:before,
.drawer-close:after{
	content: '';
	display: block;
	position: absolute;
	top: 19px;
	left: calc(100% + (25% / 2) - 15px);
	width: 30px;
	height: 2px;
	background: #fff;
	transform: rotate(45deg);
	border-radius: 1px;
}
.drawer-close:after{
	transform: rotate(135deg);
}
.drawer{
	opacity: 0;
	visibility: hidden;
	overflow: auto;
	position: fixed;
	top: 0;
	right: 100%;
	width: 80%;
	max-width: 300px;
	height: 100%;
	background: #fff;
	transition: all 0.2s ease;
	transform: none;
	z-index: 9999;
}
.drawer.open{
	opacity: 1;
	visibility: visible;
	transform: translateX(100%);
}
.drawer-main{
	margin: 15px;
	padding: 15px;
	text-align: center;
	background: #f5f5f5;
	border-radius: 3px;
}
.drawer-main p{
	margin: 0 0 10px 0;
	font-size: 1.1rem;
}
.drawer-main p span{
	font-size: 1.5rem;
	font-weight: bold;
}
.drawer-main-point{
	font-size: 1.1rem;
}
.drawer-main-point span{
	color: #e56161;
	font-size: 1.5rem;
	font-weight: bold;
}
.drawer-main-btn{
	display: flex;
	justify-content: space-between;
}
.drawer-main-btn a{
	display: block;
	margin: 0;
	width: 48%;
}
.drawer-search{
	position: relative;
	margin: 0 15px 15px 15px;
	padding: 0 10px;
	width: calc(100% - 30px);
	height: 44px;
	border: #f5f5f5 1px solid;
	border-radius: 30px;
}
.drawer-search input{
	width: 90%;
	height: 44px;
	line-height: 44px;
	background: none;
	border: none;
	appearance: none;
}
.drawer-search input::-webkit-search-cancel-button{
	appearance: none;
}
.drawer-search button{
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 10px;
	font-size: 2.0rem;
	line-height: 44px;
	background: none;
	border: none;
}
.drawer-nav-title{
	padding: 8px 15px;
	font-size: 1.1rem;
	font-weight: bold;
	background: #f5f5f5;
}
.drawer-nav-list ul li{
	border-bottom: #f5f5f5 1px solid;
}
.drawer-nav-list ul li a{
	display: block;
	position: relative;
	padding: 10px 15px 10px 25px;
	font-size: 1.3rem;
}
.drawer-nav-list ul li a:before{
	content: '\f105';
	position: absolute;
	top: 10px;
	left: 15px;
	font-family: FontAwesome;
}
.drawer-nav-list ul li ul{
	padding: 10px 15px 10px 25px;
}
.drawer-nav-list ul li ul li{
	border: none;
}
.drawer-nav-list ul li ul li a{
	padding: 5px 0;
}
.drawer-nav-list ul li ul li a:before{
	display: none;
}
.drawer-icon{
	margin: 30px 15px;
}
.drawer-icon ul{
	display: flex;
	justify-content: center;
}
.drawer-icon ul li{
	margin: 0 5px;
}
.drawer-icon ul li a{
	display: block;
	width: 44px;
	height: 44px;
	text-align: center;
	line-height: 44px;
	background: #f5f5f5;
	border-radius: 22px;
}
.drawer-copyright{
	opacity: 0.7;
	padding: 0 0 30px 0;
	font-size: 1.0rem;
	text-align: center;
}

/* footer
------------------------------------------*/
.pagetop-btn{
	opacity: 0;
	visibility: hidden;
	position: fixed;
	bottom: 30px;
	right: 30px;
	transition: all 0.2s ease;
}
.pagetop-btn.show{
	z-index: 10;
	opacity: 1;
	visibility: visible;
}
.pagetop-btn a{
	display: block;
	width: 50px;
	height: 50px;
	color: #fff;
	line-height: 50px;
	text-align: center;
	background: #1c1c1c;
	border-radius: 25px;
}
.footer{
	display: block;
	margin: 100px 0 0 0;
	padding-top: 100px;
	text-align: center;
	background: #f496c0;
	color: #fff;
}
.front_page .footer{
	margin-top: 0;
}

.info-wrap{
	display: flex;
	justify-content: center;
	gap: 34px;
	margin-bottom: 80px;
	padding: 0 calc(50vw - 640px);
}
.info{
	flex: 0 0 400px;
	text-align: center;
}
.info h2{
	margin-bottom: 30px;
}
.info-more{
	margin-top: 40px;
}

.footer-sns{
	margin-bottom: 25px;
	display: flex;
	justify-content: center;
	gap: 20px;
}

.footer-nav-wrap{
	padding: 31px calc(50vw - 640px) 25px;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
}
.footer-nav ul{
	display: flex;
	justify-content: center;
	gap: 25px;
}
.footer-nav ul li a{
	font-size: 1.4rem;
	color: inherit;
	font-weight: bold;
}
.footer-nav ul li a::before{
	content: '\f105';
	margin: 0 5px 0 0;
	font-family: FontAwesome;
}

.footer-copyright{
	height: 71px;
	line-height: 71px;
	font-size: 1.2rem;
}

.sp-footer{
	display: none;
	margin: 80px 0 0 0;
	padding: 50px;
	text-align: center;
	background: #f496c0;
	color: #fff;
}
.sphone.front_page .sp-footer{
	margin-top: 0;
}
.sp-footer-nav {
	margin-bottom: 30px;
}
.sp-footer-nav ul{
	margin: 0 auto;
	max-width: 300px;
}
.sp-footer-nav ul li{
	text-align: left;
	border-bottom: #ddd 1px solid;
}
.sp-footer-nav ul li a{
	display: block;
	position: relative;
	padding: 10px 10px 10px 20px;
	font-size: 1.3rem;
	color: inherit;
}
.sp-footer-nav ul li a:before{
	content: '\f105';
	position: absolute;
	top: 10px;
	left: 5px;
	font-family: FontAwesome;
}
.sp-footer-logo{
	margin: 60px auto 20px auto;
	width: 80px;
}
.sp-footer-copyright{
	font-size: 1.0rem;
}

/* home
------------------------------------------*/

/* mainvisual */
.mainvisual{
	position: relative;
	padding: 0 0 115px 0;
	overflow: hidden;
}
.mainvisual2{
	max-width: 1330px;
	margin: 0 auto;
}
.mainvisual .slick-slide{
	margin: 0 25px;
}

.sphone .mainvisual{
	padding-bottom: 60px;
}
.sphone .mainvisual .slick-slide{
	margin: 0;
}


.mainvisual .slick-arrow{
	cursor: pointer;
	position: absolute;
	top: 50%;
	left: 20px;
	width: 40px;
	height: 40px;
	font-size: 2.0rem;
	line-height: 40px;
	text-align: center;
	background: rgba(255, 255, 255, 0.8);
	border: none;
	border-radius: 3px;
	transform: translateY(-50%);
	z-index: 1;
}
.mainvisual .slick-arrow.fa-angle-right{
	left: auto;
	right: 20px;
}
.mainvisual .slick-dots{
	display: flex;
	justify-content: center;
	position: absolute;
	bottom: -35px;
	left: 0;
	width: 100%;

}
.mainvisual .slick-dots li{
	margin: 0 7px;
}
.mainvisual .slick-dots li:before{
	cursor: pointer;
	content: '';
	opacity: 0.5;
	display: block;
	width: 12px;
	height: 12px;
	/* background: #555; */
	border-radius: 6px;
	border: 2px solid #1c1c1c;
}
.mainvisual .slick-dots li.slick-active:before{
	background: #1c1c1c;
	opacity: 1;
}
.mainvisual .slick-dots li button{
	display: none;
}
.mainvisual .slick-list{
	padding: 0 !important;
	overflow: visible;
}
.mainvisual .slick-slide img{
	width: 100%;
}

.main-form-wrap{
	padding: 0 20px;
}
.main-form{
	position: relative;
	margin: 0 auto 50px;
	padding: 0 20px;
	max-width: 700px;
	height: 46px;
	border: 2px solid #1c1c1c;
	border-radius: 23px;
}
.main-form input{
	max-width: 660px;
	height: 42px;
	line-height: 42px;
	background: none;
	border: none;
	appearance: none;
}
.main-form input::placeholder{
	color: #e56161;
}
.main-form button{
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 10px;
	font-size: 2.0rem;
	line-height: 38px;
	background: none;
	border: none;
	color: #1c1c1c;
}

.banner{
	max-width: 1320px;
	margin: 0 auto 122px;
	padding: 0 20px;
}
.banner ul{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

.ranking{
	padding: 98px calc(50vw - 640px) 100px;
	background: #ffeaf3;
}
.ranking h2{
	margin: 0 0 50px;
	text-align: center;
}
.ranking ul{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 10px;
}
.ranking li{
	position: relative;
}
.ranking li::after{
	content:"";
	display: block;
	width: 70px;
	height: 80px;
	position: absolute;
	top: 10px;
	left: 10px;
}
.ranking li:nth-child(1)::after{
	background: url(/html/template/cectpl/assets/img/rank1.png) no-repeat center 0 / contain;
}
.ranking li:nth-child(2)::after{
	background: url(/html/template/cectpl/assets/img/rank2.png) no-repeat center 0 / contain;
}
.ranking li:nth-child(3)::after{
	background: url(/html/template/cectpl/assets/img/rank3.png) no-repeat center 0 / contain;
}
.ranking li:nth-child(4)::after{
	background: url(/html/template/cectpl/assets/img/rank4.png) no-repeat center 0 / contain;
}
.ranking li:nth-child(5){
	display: none;
}
.ranking li:nth-child(5)::after{
	background: url(/html/template/cectpl/assets/img/rank5.png) no-repeat center 0 / contain;
}
@media screen and (min-width: 1280px){
.ranking ul {
	grid-template-columns: repeat(4, 1fr);
	grid-template-rows: repeat(2, 1fr);
}
.ranking li:nth-child(1) { grid-area: 1 / 1 / 3 / 3; }
.ranking li:nth-child(1)::after{
	top: 20px;
	left: 20px;
	width: 86px;
	height: 100px;
}
.ranking li:nth-child(2) { grid-area: 1 / 3 / 2 / 4; }
.ranking li:nth-child(3) { grid-area: 1 / 4 / 2 / 5; }
.ranking li:nth-child(4) { grid-area: 2 / 3 / 3 / 4; }
.ranking li:nth-child(5) {
	display: block;
	grid-area: 2 / 4 / 3 / 5;
}
}
.ranking .image{}
.ranking .image img{
	width: 100%;
}

.newitems{
	padding: 98px calc(50vw - 640px) 90px;
	background: #fff;
}
.newitems.rec{
	background: #fffee7;
}
.newitems h2{
	margin-bottom: 50px;
	text-align: center;
}
.newitems ul{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 27px;
}
.newitems .image{
	margin: 0 0 15px 0;
}
.newitems .image img{
	width: 100%;
	border: 1px solid #e4e4e4;
}
.newitems .text h3{
	margin: 5px 0;
	font-weight: bold;
}
.newitems .text .price{
	text-align: right;
	font-size: 1.4rem;
	color: #ed4685;
}
.newitems .text .price03{
	color: #e56161;
	font-size: 1.3rem;
}


.newblog{
	position: relative;
	padding: 98px calc(50vw - 640px) 100px;
}
.newblog h2{
	margin-bottom: 49px;
	text-align: center;
}
.newblog-list{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-row-gap: 40px;
}
.newblog .item{
	display: flex;
	align-items: center;
	padding-right: 40px;
}
.newblog .image{
	flex: 0 0 120px;
	margin-right: 25px;
}
.newblog .image img{
	width: 100%;
}
.newblog .date{
	font-size: 1.4rem;
	color: #f496c0;
}
.newblog .text a{
	color: inherit;
}
.newblog-more{
	margin-top: 60px;
	text-align: center;
}

.about{
	padding: 100px calc(50vw - 640px);
	background: url(/html/template/cectpl/assets/img/con-bg.jpg) no-repeat right center / cover;
}
.about-inner{
	max-width: 500px;
	margin-right: auto;
	padding: 78px 82px 60px;
	background: rgba(255,255,255,.95);
}
.about h2{
	margin-bottom: 30px;
}
.about-body{
	line-height: 2;
}
.about-more{
	margin-top: 40px;
}


.sphone .ranking{
	padding: 30px 10px;
}
.sphone .ranking h2{
	margin-bottom: 20px;
}
.sphone .ranking li::after{
	width: 10vw;
	height: 12vw;
}
.sphone .newitems{
	padding: 30px 10px;
}
.sphone .newitems h2{
	margin-bottom: 20px;
}

.sphone .newblog{
	padding: 30px 10px;
}
.sphone .newblog h2{
	margin-bottom: 20px;
}
.sphone .newblog-list{
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 20px;
}

.sphone .about{
	padding: 30px 10px;
}
.sphone .about-inner{
	padding: 40px 20px;
}
.sphone .about h2{
	padding: 0 30vw 0 0;
}
.sphone .about-more{
	text-align: center;
}

/* page
------------------------------------------*/

/* title */
.page-title{
	padding: 60px 0;
	background: url(/html/template/cectpl/assets/img/page-title-bg.jpg) no-repeat center center / cover;

}
.page-title-inner{
	margin: 0 auto;
	padding: 0 20px;
	max-width: 1320px;
	text-align: center;
}
.page-title-inner h1,
.page-title-inner p{
	font-size: 3.6rem;
	font-weight: bold;
	line-height: 1.3;
	color: #fff;
}

/* breadcrumb */
.breadcrumb{
	margin: 10px 0 70px 0;
	font-size: 1.2rem;
}
.breadcrumb-inner{
	margin: 0 auto;
	padding: 0 20px;
	max-width: 1320px;
}
.breadcrumb ul{
	display: flex;
}
.breadcrumb ul li:after{
	content: '>';
	margin: 0 5px;
}
.breadcrumb ul li:last-child:after{
	display: none;
}
.breadcrumb ul li a{
}
.breadcrumb ul li span{
}

/* product list */
.ec-productListRole{
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
}
.ec-productListRole__main{
	margin: 0 0 50px 0;
	width: calc(100% - 240px);
}
.ec-productListRole__side{
	width: 200px;
}
.ec-productListCategory{
	margin: 0 0 50px 0;
}
.ec-productListCategory__image{
	margin: 0 0 30px 0;
}
.ec-productListCategory__image img{
	width: 100%;
}
.ec-productListCategory__content{
}
.ec-searchnavRole{
	margin: 0 0 30px 0;
}
.ec-searchnavRole__topicpath{
	margin: 0 0 5px 0;
	padding: 0 0 10px 0;
	border-bottom: #ddd 1px solid;
}
.ec-topicpath{
	display: flex;
}
.ec-topicpath li{
}
.ec-topicpath li.ec-topicpath__divider{
	margin: 0 5px;
}
.ec-topicpath li a{
	font-weight: bold;
}
.ec-searchnavRole__infos{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.ec-searchnavRole__counter span.ec-font-bold{
	font-weight: bold;
}
.ec-shelfGrid{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.ec-shelfGrid li.ec-shelfGrid__item{
	position: relative;
}
.ec-shelfGrid li.ec-shelfGrid__item .ec-shelfGrid__item-image{
	margin: 0 0 15px 0;
}
.ec-shelfGrid li.ec-shelfGrid__item .ec-shelfGrid__item-image img{
	width: 100%;
}
.ec-shelfGrid li.ec-shelfGrid__item h3{
	margin: 0 0 5px 0;
	font-weight: bold;
}
.ec-shelfGrid li.ec-shelfGrid__item .ec-shelfGrid__description{
	margin: 5px 0;
	font-size: 1.3rem;
}
.ec-shelfGrid li.ec-shelfGrid__item .price02-default{
	font-size: 1.3rem;
	font-weight: normal;
}
.ec-shelfGrid li.ec-shelfGrid__item .price03-default{
	position: absolute;
	top: 5px;
	left: 5px;
	padding: 2px 6px;
	color: #fff;
	font-size: 1.1rem;
	font-weight: normal;
	background: #e56161;
	border-radius: 3px;
}

.ec-pagerRole{
	margin: 50px 0;
}
.ec-pagerRole ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.ec-pagerRole ul li{
	margin: 0 2px;
}
.ec-pagerRole ul li a{
	display: block;
	padding: 5px 12px;
	color: #555;
	border: #555 1px solid;
	border-radius: 3px;
}
.ec-pagerRole ul li.ec-pager__item--active a{
	color: #fff;
	font-weight: bold;
	background: #555;
}

/* product list sidebar */
.ec-SideBlockRole{
	margin: 0 0 30px 0;
}
.ec-SideBlockRole h3{
	margin: 0 0 5px 0;
	padding: 0 0 5px 0;
	border-bottom: #555 2px solid;
}
.ec-SideBlockRole ul li{
	padding: 5px 0;
	border-bottom: #ddd 1px dashed;
}
.ec-SideBlockRole ul li ul{
	padding: 10px;
}
.ec-SideBlockRole ul li ul li{
	font-size: 1.3rem;
	border: none;
}
.ec-sideAboutRole__main{
	padding: 15px;
	font-size: 1.3rem;
	background: #f5f5f5;
}
.ec-sideAboutRole__main .name{
	margin: 0 0 5px 0;
	font-weight: bold;
}
.ec-sideAboutRole__main .text p{
	position: relative;
	padding: 0 0 0 15px;
}
.ec-sideAboutRole__main .text p:before{
	content: '\f041';
	position: absolute;
	top: 0;
	left: 0;
	color: #555;
	font-family: FontAwesome;
}
.ec-sideAboutRole__main .text .phone_number:before{
	content: '\f095';
}
.ec-sideAboutRole__main .text .business_hour:before{
	content: '\f017';
}
.ec-sideCalendarRole .calendar-once:not(:first-of-type){
	margin: 20px 0 0 0;
}
.ec-sideCalendarRole .calendar-once .calendar-title{
	margin: 0 0 10px 0;
	font-weight: bold;
	text-align: center;
}
.ec-sideCalendarRole table{
	width: 100%;
}
.ec-sideCalendarRole table thead th{
	padding: 5px 0;
	font-size: 1.1rem;
	font-weight: bold;
	text-align: center;
}
.ec-sideCalendarRole table tbody td{
	padding: 5px 0;
	font-size: 1.3rem;
	text-align: center;
}
.ec-sideCalendarRole table tbody td.off{
	color: #e56161;
	background: #f9e5e5;
}
.ec-sideCalendarRole table th:nth-of-type(1),
.ec-sideCalendarRole table td:nth-of-type(1),
.ec-sideCalendarRole table th:nth-of-type(7),
.ec-sideCalendarRole table td:nth-of-type(7){
}

/* product detail */
.deliv-notice{
	margin: 0 0 50px 0;
	padding: 15px;
	color: #fff;
	text-align: center;
	background: #e56161;
	border-radius: 3px;
}
.deliv-notice:before{
	content: '\f071';
	margin: 0 8px 0 0;
	font-family: FontAwesome;
}
.ec-productRole .ec-grid2{
	display: flex;
	margin: 0 0 80px 0;
}
.ec-productRole .ec-grid2__cell{
	position: relative;
	width: 55%;
}
.ec-productRole .ec-grid2__cell:last-of-type{
	padding: 0 0 0 40px;
	width: 45%;
}
.ec-sliderItemRole{
	position: sticky;
	top: 20px;
}
.ec-sliderItemRole .item_visual img{
	width: 100%;
}
.ec-sliderItemRole .item_nav{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 10px;
	margin: 10px 0 0 0;
}
.ec-sliderItemRole .item_nav .slideThumb{
	cursor: pointer;
}
.default .ec-sliderItemRole .item_nav .slideThumb img:hover{
	opacity: 0.7;
}
.ec-productRole__code{
	margin: 0 0 10px 0;
	color: #aaa;
	font-size: 1.3rem;
}
.ec-productRole__profile .ec-headingTitle{
	margin: 0 0 20px 0;
	font-size: 3.2rem;
}
.ec-productRole__tags{
	display: flex;
	margin: 0 0 20px 0;
}
.ec-productRole__tags li{
	display: block;
	margin: 0 5px 0 0;
	padding: 3px 8px;
	color: #fff;
	font-size: 1.1rem;
	background: #555;
	border-radius: 3px;
}
.ec-productRole__price .ec-price__tax{
	font-size: 1.3rem;
}
.ec-productRole__price01{
	opacity: 0.7;
}
.ec-productRole__price01 .ec-price__price{
	text-decoration: line-through;
}
.ec-productRole__price03{
	margin: 10px 0 0 0;
	padding: 20px;
	background: #f5f5f5;
	border-radius: 3px;
}
.ec-productRole__price03 p{
	margin: 0 0 5px 0;
}
.ec-productRole__price03 p span{
	display: block;
	color: #e56161;
	font-size: 1.3rem;
}
.ec-productRole__price02 .ec-price__price,
.ec-productRole__price03 .ec-price__price{
	color: #e56161;
	font-size: 2.4rem;
	font-weight: bold;
}
.ec-productRole__price02.hidden{
	opacity: 0.7;
}
.ec-productRole__price02.hidden .ec-price__price{
	color: #333;
	font-size: 1.5rem;
	font-weight: normal;
	text-decoration: line-through;
}
.ec-productRole__category{
	margin: 20px 0;
	padding: 20px 0 0 0;
	border-top: #ddd 1px solid;
}
.ec-productRole__category div{
	margin: 0 0 5px 0;
	font-weight: bold;
}
.ec-productRole__category ul{
	padding: 0 0 0 10px;
}
.ec-productRole__cart{
	margin: 0 0 20px 0;
	padding: 20px;
	background: #f5f5f5;
	border-radius: 3px;
}
.ec-productRole__actions{
}
.ec-productRole__actions > div{
	margin: 0 0 10px 0;
}
.ec-productRole__actions .ec-select select{
	width: 100%;
}
.ec-productRole__actions .ec-numberInput{
	display: flex;
	align-items: center;
}
.ec-productRole__actions .ec-numberInput span{
	width: 15%;
}
.ec-productRole__actions .ec-numberInput input{
	width: 85%;
}
.ec-productRole__btn{
	margin: 10px 0 0 0;
}
.ec-productRole__freearea{
	margin: 0 0 80px 0;
}
.ec-classcategory{
	margin: 0 0 30px 0;
}
.ec-classcategory dl dt{
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-weight: bold;
	background: #f5f5f5;
	border-radius: 3px;
}
.ec-classcategory dl dt p{
	padding: 10px 15px;
}
.ec-classcategory dl dt span{
	width: 70px;
	font-weight: normal;
	text-align: center;
}
.ec-classcategory dl dd{
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	border-bottom: #ddd 1px dashed;
	transition: all 0.2s linear;
}
.default .ec-classcategory dl dd:hover{
	opacity: 0.7;
}
.ec-classcategory dl dd+dt{
	margin: 20px 0 0 0;
}
.ec-classcategory dl dd .name{
	padding: 15px;
	width: calc(100% - 230px);
	font-weight: bold;
}
.ec-classcategory dl dd .name span{
	display: block;
	color: #aaa;
	font-size: 1.3rem;
	font-weight: normal;
}
.ec-classcategory dl dd .price{
	padding: 15px 15px 15px 0;
	width: 180px;
	text-align: right;
}
.ec-classcategory dl dd .price .default{
	color: #aaa;
	font-size: 1.3rem;
}
.ec-classcategory dl dd .price .member span{
	color: #e56161;
}
.ec-classcategory dl dd .stock{
	width: 70px;
	text-align: center;
	border-left: #ddd 1px dashed;
}
.ec-classcategory dl dd .stock.stock-unlimited{
	color: #e56161;
}
.ec-classcategory dl dd .stock.stock-none{
	padding: 0 2px 0 0;
	color: #aaa;
}

.ec-classcategory-table{
	margin: 0 0 30px 0;
}
.ec-classcategory-table table{
	width: 100%;
	table-layout: fixed;
}
.ec-classcategory-table table thead th,
.ec-classcategory-table table tbody th{
	padding: 10px 5px;
	font-size: 1.3rem;
	font-weight: bold;
	vertical-align: middle;
	background: #f5f5f5;
	border: #ddd 1px solid;
}
.ec-classcategory-table table tbody td{
	padding: 10px 5px;
	font-size: 1.2rem;
	text-align: right;
	vertical-align: middle;
	border: #ddd 1px solid;
}
.ec-classcategory-table table tbody td span{
	color: #333;
}
.ec-classcategory-table table tbody td .code{
	color: #aaa;
}
.ec-classcategory-table .comment{
	margin: 5px 0 0 0;
	color: #aaa;
	font-size: 1.1rem;
}

/* other common */
.ec-link{
	cursor: pointer;
	text-decoration: underline;
}
.ec-required{
	margin: 0 0 0 10px;
	color: #e56161;
}
.ec-para-normal{
	margin: 0 0 50px 0;
}
.ec-para-normal + .ec-para-normal{
	margin: -50px 0 50px 0;
}
.ec-borderedDefs dl{
	display: flex;
	margin: 0 0 30px 0;
	padding: 0 0 30px 0;
	border-bottom: #ddd 1px dashed;
}
.ec-borderedDefs dl dt{
	width: 20%;
	font-weight: bold;
}
.ec-borderedDefs dl dd{
	position: relative;
	width: 80%;
}
.ec-borderedDefs dl dd p{
	margin: 5px 0 0 0;
	font-size: 1.3rem;
}
.ec-off4Grid{
	margin: 30px auto;
	max-width: 400px;
}
.ec-off4Grid .ec-checkbox{
	margin: 0 0 20px 0;
	text-align: center;
}
.ec-reportHeading{
	margin: 0 0 20px 0;
	font-size: 2.4rem;
	text-align: center;
}
.ec-reportDescription{
	text-align: center;
}

/* login */
.ec-login{
	margin: 0 auto;
	max-width: 600px;
}
.ec-login__icon{
	display: none;
}
.ec-login__input .ec-input input{
	margin: 0 0 10px 0;
}
.ec-login__input .ec-checkbox{
	margin: 10px 0 0 0;
}
.ec-login .ec-grid2{
	display: flex;
}
.ec-login .ec-grid2 .ec-grid2__cell{
	width: 50%;
}
.ec-login .ec-grid2 .ec-grid2__cell:last-of-type{
	padding: 0 0 0 30px;
}

/* cart */
.page-cart .ec-grid3{
	display: flex;
	justify-content: space-between;
}
.page-cart .ec-grid3 .ec-grid3__cell2{
	width: 60%;
}
.page-cart .ec-grid3 .ec-grid3__cell{
	width: calc(40% - 40px);
}
.ec-guest{
	display: flex;
	align-items: center;
	padding: 0 50px;
	height: 100%;
	text-align: center;
	background: #f5f5f5;
	border-radius: 3px;
}
.ec-guest p{
	margin: 0 0 15px 0;
}
.ec-cartRole__progress{
	text-align: center;
}
.ec-progress{
	display: flex;
	justify-content: center;
	margin: 0 0 50px 0;
}
.ec-progress__item{
	position: relative;
	width: 20%;
	max-width: 100px;
	text-align: center;
}
.ec-progress__item:after{
	z-index: -1;
	content: '';
	display: block;
	position: absolute;
	top: 18px;
	left: 50%;
	width: 100%;
	height: 4px;
	background: #555;
}
.ec-progress__item:last-of-type:after{
	display: none;
}
.ec-progress__number{
	margin: 0 auto 10px auto;
	width: 40px;
	height: 40px;
	color: #fff;
	font-size: 2.0rem;
	font-weight: bold;
	text-align: center;
	line-height: 40px;
	background: #555;
	border-radius: 20px;
}
.ec-progress__label{
	font-size: 1.3rem;
	font-weight: bold;
}
.is-complete .ec-progress__number{
	background: #e56161;
}
.is-complete .ec-progress__label{
	color: #e56161;
}
.ec-cartRole__totalText{
	margin: 30px 0;
	text-align: center;
}
.ec-cartTable{
	display: table;
	width: 100%;
}
.ec-cartHeader{
	display: table-row;
}
.ec-cartHeader li{
	display: table-cell;
	padding: 20px;
	color: #555;
	font-weight: bold;
	text-align: center;
	background: #f5f5f5;
}
.ec-cartRow{
	display: table-row;
}
.ec-cartRow li{
	display: table-cell;
	padding: 20px 0;
	vertical-align: middle;
	border-bottom: #ddd 1px dashed;
}
.ec-cartRow__delColumn{
	width: 8%;
}
.ec-cartRow__delColumn a img{
	display: none;
}
.ec-cartRow__delColumn a{
	display: block;
	position: relative;
	margin: 0 auto;
	width: 40px;
	height: 40px;
}
.ec-cartRow__delColumn a:before,
.ec-cartRow__delColumn a:after{
	content: '';
	display: block;
	position: absolute;
	top: 19px;
	left: 10px;
	width: 20px;
	height: 2px;
	background: #555;
	transform: rotate(45deg);
	border-radius: 1px;
}
.ec-cartRow__delColumn a:after{
	transform: rotate(135deg);
}
.ec-cartRow__contentColumn{
}
.ec-cartRow__img{
	display: table-cell;
	width: 80px;
	vertical-align: middle;
}
.ec-cartRow__summary{
	display: table-cell;
	padding: 0 0 0 15px;
	font-size: 1.1rem;
	font-weight: bold;
	vertical-align: middle;
}
.ec-cartRow__name a{
	font-size: 1.5rem;
}
.ec-cartRow__unitPrice{
	margin: 5px 0 0 0;
	font-size: 1.5rem;
}
.ec-cartRow__sutbtotalSP,
.ec-cartRow__amountSP{
	display: none;
}
.ec-cartRow__amountColumn{
	width: 12%;
	text-align: center;
}
.ec-cartRow__amount{
	margin: 0 0 10px 0;
}
.ec-cartRow__amountUpDown a,
.ec-cartRow__amountUpDown div{
	display: inline-block;
	position: relative;
	margin: 0 2px;
	width: 36px;
	height: 36px;
	text-align: center;
	line-height: 36px;
	border: #555 2px solid;
	border-radius: 20px;
}
.ec-cartRow__amountUpDown div{
	opacity: 0.3;
}
.ec-cartRow__amountUpDown a img,
.ec-cartRow__amountUpDown div img{
	display: none;
}
a.ec-cartRow__amountDownButton:before,
a.ec-cartRow__amountUpButton:before,
a.ec-cartRow__amountUpButton:after,
div.ec-cartRow__amountDownButtonDisabled:before{
	content: '';
	display: block;
	position: absolute;
	top: 15px;
	left: 10px;
	width: 12px;
	height: 2px;
	background: #555;
	border-radius: 1px;
}
a.ec-cartRow__amountUpButton:after{
	transform: rotate(90deg);
}
.ec-cartRow__subtotalColumn{
	width: 12%;
	text-align: right;
}
.ec-cartRole__actions{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	flex-direction: row-reverse;
}
.ec-cartRole__total{
	margin: 30px 0;
	width: 100%;
	font-size: 1.8rem;
	font-weight: bold;
	text-align: right;
}
.ec-cartRole__total span{
	margin: 0 0 0 10px;
	color: #e56161;
	font-size: 2.4rem;
}
.ec-cartRole__actions .ec-blockBtn--action,
.ec-cartRole__actions .ec-blockBtn--cancel{
	margin: 0 10px;
	width: 200px;
}
.ec-alert-warning{
	margin: 30px 0;
	padding: 15px;
	color: #fff;
	text-align: center;
	background: #e56161;
	border-radius: 3px;
}
.ec-alert-warning__icon img{
	display: none;
}
.ec-alert-warning__text:before{
	content: '\f071';
	margin: 0 8px 0 0;
	font-family: FontAwesome;
}
.ec-orderRole{
	display: flex;
	justify-content: space-between;
}
.ec-orderRole__detail{
	width: 60%;
}
.ec-orderRole__summary{
	width: calc(40% - 40px);
}
.ec-orderRole__detail h2{
	margin: 0 0 20px 0;
	height: 44px;
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 44px;
}
.ec-orderAccount,
.ec-orderDelivery,
.ec-orderPayment,
.ec-orderConfirm{
	position: relative;
	margin: 0 0 30px 0;
	padding: 30px;
	background: #fff;
	border: #ddd 1px solid;
	border-radius: 3px;
}
.ec-orderAccount__change button,
.ec-orderDelivery__change button{
	position: absolute;
	top: 30px;
	right: 30px;
	color: #555;
	background: #fff;
	border: #555 1px solid;
}
.mod-button{
	display: flex;
}
.mod-button span{
	margin: 0 10px 0 0;
}
.ec-orderDelivery__title{
	margin: 0 0 20px 0;
	padding: 0 0 5px 0;
	font-weight: bold;
	border-bottom: #ddd 1px solid;
}
.ec-borderedList li{
	margin: 0 0 20px 0;
	padding: 0 0 20px 0;
	border-bottom: #ddd 1px dashed;
}
.ec-imageGrid{
	display: flex;
	align-items: center;
}
.ec-imageGrid__img{
	width: 80px;
}
.ec-imageGrid__content{
	padding: 0 0 0 20px;
	font-size: 1.3rem;
}
.ec-imageGrid__content span{
	margin: 0 0 0 5px;
}
.ec-selects{
	display: flex;
	flex-wrap: wrap;
	margin: 0 0 20px 0;
}
.ec-selects .ec-select label{
	margin: 0 10px 0 0;
	font-weight: bold;
}
.ec-selects .ec-select:first-of-type{
	margin: 10px 0;
	width: 100%;
}
.ec-selects .ec-select__delivery{
	margin: 0 20px 0 0;
}
.ec-totalBox{
	margin: 0 0 30px 0;
	padding: 30px;
	background: #f5f5f5;
	border-radius: 3px;
}
.ec-totalBox__spec{
	display: flex;
	justify-content: space-between;
}
.ec-totalBox__total{
	margin: 10px 0 0 0;
	padding: 10px 0 0 0;
	font-weight: bold;
	text-align: right;
	border-top: #ddd 1px dashed;
}
.ec-totalBox__total .ec-totalBox__price{
	margin: 0 5px 0 10px;
	font-size: 2.4rem;
}
.ec-totalBox__taxRate{
	display: flex;
	justify-content: flex-end;
	font-size: 1.1rem;
}
.ec-totalBox__taxRate dt{
	margin: 0 5px 0 0;
}
.ec-totalBox__taxRate dt:before{
	content: '[ ';
}
.ec-totalBox__taxRate dd:after{
	content: ' ]';
}
.ec-totalBox__paymentTotal{
	margin: 10px 0 20px 0;
	font-weight: bold;
	text-align: right;
}
.ec-totalBox__paymentTotal .ec-totalBox__price{
	margin: 0 5px 0 10px;
	color: #e56161;
	font-size: 2.4rem;
}
.ec-totalBox__pointBlock{
	margin: 10px 0 0 0;
	padding: 10px 0;
	border-top: #ddd 1px dashed;
}
.ec-addressRole__actions,
.ec-AddAddress__new{
	margin: 0 0 30px 0;
}
.ec-addressList__item{
	display: flex;
	align-items: center;
	margin: 0 0 20px 0;
	padding: 30px;
	background: #f5f5f5;
	border-radius: 3px;
}
.ec-addressList__remove .ec-icon{
	position: relative;
	width: 40px;
	height: 40px;
	background: #fff;
	border-radius: 3px;
}
.ec-addressList__remove .ec-icon img{
	display: none;
}
.ec-addressList__remove .ec-icon:before,
.ec-addressList__remove .ec-icon:after{
	content: '';
	display: block;
	position: absolute;
	top: 19px;
	left: 10px;
	width: 20px;
	height: 2px;
	background: #555;
	transform: rotate(45deg);
	border-radius: 1px;
}
.ec-addressList__remove .ec-icon:after{
	transform: rotate(135deg);
}
.ec-addressList__action{
	margin: 0 0 0 auto;
	padding: 0 0 0 20px;
}
.ec-addressList__address{
	padding: 0 0 0 20px;
}
.ec-AddAddress__add{
	margin: 0 0 30px 0;
	padding: 0 0 30px 0;
	border-bottom: #ddd 1px dashed;
}
.ec-AddAddress__item{
	display: flex;
	align-items: center;
	padding: 30px;
	background: #f5f5f5;
	border-radius: 3px;
}
.ec-AddAddress__itemThumb{
	width: 120px;
}
.ec-AddAddress__itemtContent{
	padding: 0 0 0 20px;
}
.ec-AddAddress__itemtTitle{
	margin: 0 0 5px 0;
	font-weight: bold;
}
.ec-AddAddress__select{
	display: flex;
	flex-wrap: wrap;
	margin: 20px 0;
	width: 100%;
}
.ec-AddAddress__select label{
	font-weight: bold;
}
.ec-AddAddress__select select,
.ec-AddAddress__select input{
	margin: 0 10px 0 0;
}
.ec-AddAddress__selectNumber input{
	display: inline-block;
	width: 80px;
}

/* mypage */
.ec-navlistRole__navlist{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.ec-navlistRole__navlist .ec-navlistRole__item{
	width: 19%;
}
.ec-navlistRole__navlist .ec-navlistRole__item a{
	display: block;
	padding: 10px;
	font-weight: bold;
	text-align: center;
	background: #f5f5f5;
	border-radius: 3px;
}
.ec-navlistRole__navlist .ec-navlistRole__item.active a{
	color: #fff;
	background: #555;
}
.ec-welcomeMsg{
	margin: 30px 0;
	padding: 0 0 30px 0;
	text-align: center;
	border-bottom: #ddd 1px solid;
}

.ec-historyRole__contents{
	display: flex;
	padding: 30px 0;
	border-top: #ddd 1px dashed;
}
.ec-historyRole__header{
	width: 25%;
}
.ec-historyListHeader__date{
	margin: 0 0 10px 0;
	font-weight: bold;
}
.ec-definitions{
	display: flex;
}
.ec-definitions dt{
	width: 120px;
}
.ec-definitions dt:after{
	content: ' :';
}
.ec-historyListHeader__action{
	margin: 10px 0 0 0;
}
.ec-historyRole__detail .ec-imageGrid{
	margin: 10px 0 0 0;
}
.ec-historyRole__detail .ec-imageGrid:first-of-type{
	margin: 0;
}
.ec-orderOrder{
	margin: 0 0 30px 0;
}
.ec-orderDelivery__item{
	margin: 0 0 10px 0;
}
.ec-orderDelivery__address{
	margin: 0 0 10px 0;
}
.ec-definitions--soft{
	display: flex;
}
.ec-definitions--soft dt{
	width: 100px;
}
.ec-orderMail__body{
	display: none;
}
.ec-orderMail{
	margin: 0 0 30px 0;
	padding: 30px;
	background: #fff;
	border: #ddd 1px solid;
	border-radius: 3px;
}
.ec-orderMail__link a{
	cursor: pointer;
	font-weight: bold;
	text-decoration: underline;
}
.ec-orderMail__body{
	margin: 20px 0 0 0;
	font-size: 1.3rem;
}
.ec-orderMail__close{
	margin: 20px 0 0 0;
	text-align: center;
}
.ec-orderMail__close a{
	text-decoration: underline;
}

.ec-favoriteRole__header{
	margin: 0 0 20px 0;
}
.ec-favoriteRole__itemList{
	display: flex;
	flex-wrap: flex;
	margin: 0 -15px;
}
.ec-favoriteRole__itemList li{
	position: relative;
	margin: 0 0 30px 0;
	padding: 0 15px;
	width: 25%;
}
.ec-favoriteRole__itemList li a.ec-closeBtn--circle{
	display: block;
	position: absolute;
	top: 5px;
	right: 20px;
	width: 40px;
	height: 40px;
	background: rgba(255, 255, 255, 0.8);
	border-radius: 3px;
}
.ec-favoriteRole__itemList li a.ec-closeBtn--circle:before,
.ec-favoriteRole__itemList li a.ec-closeBtn--circle:after{
	content: '';
	display: block;
	position: absolute;
	top: 19px;
	left: 10px;
	width: 20px;
	height: 2px;
	background: #555;
	transform: rotate(45deg);
	border-radius: 1px;
}
.ec-favoriteRole__itemList li a.ec-closeBtn--circle:after{
	transform: rotate(135deg);
}
.ec-favoriteRole__itemList li a.ec-closeBtn--circle img{
	display: none;
}
.ec-favoriteRole__itemTitle{
	margin: 10px 0 0 0;
}
.ec-withdrawRole .ec-icon,
.ec-withdrawConfirmRole .ec-icon{
	display: none;
}

/* blog list */
.ec-blogListRole,
.ec-blogDetailRole{
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
}
.ec-blogListRole__main,
.ec-blogDetailRole__main{
	margin: 0 0 50px 0;
	width: calc(100% - 240px);
}
.ec-blogListRole__side,
.ec-blogDetailRole__side{
	width: 200px;
}
.ec-blogListRole__main h2{
	margin: 0 0 30px 0;
	font-size: 1.8rem;
	border-bottom: #333 2px solid;
}
.ec-blogListRole__main .item{
	display: flex;
	margin: 0 0 40px 0;
}
.ec-blogListRole__main .image{
	width: 150px;
}
.ec-blogListRole__main .text{
	padding: 0 0 0 20px;
	width: calc(100% - 150px);
}
.ec-blogListRole__main .text h3{
	margin: 0 0 10px 0;
	font-size: 2.2rem;
}
.ec-blogListRole__main .text .meta{
	display: flex;
	justify-content: space-between;
	margin: 20px 0 0 0;
	font-size: 1.3rem;
}
.ec-blogListRole__main .text .meta .categories ul,
.ec-blogDetailRole__main .categories ul{
	display: flex;
	flex-wrap: wrap;
}
.ec-blogListRole__main .text .meta .categories ul li,
.ec-blogDetailRole__main .categories ul li{
	margin: 0 5px 0 0;
}
.ec-blogListRole__main .text .meta .categories ul li a,
.ec-blogDetailRole__main .categories ul li a{
	display: block;
	padding: 2px 10px;
	color: #fff;
	font-size: 1.3rem;
	background: #555;
	border-radius: 20px;
}

/* blog detail */
.ec-blogDetailRole__main .categories ul{
	margin: 0 0 10px 0;
}
.ec-blogDetailRole__main h1{
	margin: 0 0 10px 0;
	font-size: 3.2rem;
}
.ec-blogDetailRole__main .date{
	margin: 0 0 20px 0;
	color: #aaa;
	font-size: 1.3rem;
}
.ec-blogDetailRole__main .eyecatch{
	margin: 0 0 10px 0;
}
.ec-blogDetailRole__main .eyecatch img{
	width: 100%;
}
.ec-blogDetailRole__main .sns{
	margin: 0 0 60px 0;
}
.ec-blogDetailRole__main .sns ul{
	display: flex;
	margin: 0 -2px;
}
.ec-blogDetailRole__main .sns ul li{
	margin: 0 2px;
	width: calc(100% / 5);
}
.ec-blogDetailRole__main .sns ul li a{
	display: block;
	padding: 10px;
	color: #fff;
	font-weight: normal;
	text-align: center;
	text-decoration: none;
	border-radius: 3px;
}
.ec-blogDetailRole__main .sns ul li a .fa{
	margin: 0 5px 0 0;
	font-weight: bold;
}
.ec-blogDetailRole__main .sns ul li.sns-facebook a{ background: #3B5998; }
.ec-blogDetailRole__main .sns ul li.sns-twitter a{ background: #55acee; }
.ec-blogDetailRole__main .sns ul li.sns-line a{ background: #1dcd00; }
.ec-blogDetailRole__main .sns ul li.sns-hatena a{ background: #008fde; }
.ec-blogDetailRole__main .sns ul li.sns-pocket a{ background: #d3505a; }

.ec-blogDetailRole__main .tags{
	margin: 30px 0;
}
.ec-blogDetailRole__main .tags ul{
	display: flex;
	margin: 0 0 10px 0;
}
.ec-blogDetailRole__main .tags ul li{
	margin: 0 5px 0 0;
}
.ec-blogDetailRole__main .tags ul li a{
	display: block;
	padding: 1px 5px;
	font-size: 1.1rem;
	border: #555 1px solid;
	border-radius: 3px;
}
.ec-blogDetailRole__main-content{
}
.ec-blogDetailRole__main-content p{
	margin: 30px 0;
}
.ec-blogDetailRole__main-content p a{
	text-decoration: underline;
}
.ec-blogDetailRole__main-content h2{
	margin: 30px 0;
	font-size: 2.5rem;
	font-weight: bold;
}
.ec-blogDetailRole__main-content h3{
	margin: 30px 0;
	font-size: 2.0rem;
	font-weight: bold;
}
.ec-blogDetailRole__main-content h4{
	margin: 30px 0;
	font-size: 1.8rem;
	font-weight: bold;
}

/* blog side */
.ec-blogSideBlockRole{
	margin: 0 0 30px 0;
}
.ec-blogSideBlockRole h3{
	margin: 0 0 5px 0;
	padding: 0 0 5px 0;
	border-bottom: #555 2px solid;
}
.ec-blogSideBlockRole ul li{
	padding: 5px 0;
	border-bottom: #ddd 1px dashed;
}
.ec-blogSideBlockRole ul li ul{
	padding: 10px;
}
.ec-blogSideBlockRole ul li ul li{
	font-size: 1.3rem;
	border: none;
}

/* other */
.page-content p{
	margin: 40px 0;
}
.page-content iframe{
	width: 100%;
	height: 400px;
}
.page-content h2{
	margin: 40px 0;
	padding: 15px 20px;
	border-radius: 10px;
	font-size: 2.8rem;
	font-weight: bold;
	color: #fff;
	background: #f496c0;
}
.page-content h3{
	position: relative;
	margin: 40px 0;
	padding: 0 0 10px 0;
	font-size: 2.2rem;
	font-weight: bold;
	color: #564d43;
	border-bottom: #e4e4e4 4px solid;
}
.page-content h3::after{
	content:"";
	position: absolute;
	bottom: -4px;
	left: 0;
	display: block;
	width: 20%;
	height: 4px;
	background: #92d9f0;
}
.page-content h4{
	margin: 40px 0;
	padding: 0 0 10px 0;
	font-size: 1.8rem;
	font-weight: bold;
}
.page-content h4::before{
	content: '\f138';
	margin: 0 5px 0 0;
	font-family: FontAwesome;
	color: #deafea;
}
.page-content ul{
	margin: 40px 0;
}
.page-content ul li{
	margin: 10px 0 10px 25px;
	list-style: outside disc;
}
.page-content ol{
	margin: 40px 0;
}
.page-content ol li{
	margin: 10px 0 10px 25px;
	list-style: outside decimal;
}

/* bootstrap */
.modal {
    overflow: auto;
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    padding: 40px;
    width: 600px;
    max-width: 80%;
    max-height: 80%;
    background-color: #ffffff;
    border-radius: 10px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    transform: translate(-50%, -50%);
    z-index: 1;
}
.modal.open {
    display: block;
}
.modal .modal-dialog {
    margin: 0 !important;
    background-color: #ffffff;
    opacity: 1;
}
.modal p.text-left {
    padding: 15px;
    color: #333333;
    font-size: 1.2rem;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    border-radius: 5px;
    margin-bottom: 20px;
}
.modal-footer {
    display: flex;
    justify-content: center;
    margin: 40px 0 0 0;
    gap: 10px;
}
.modal-footer button {
    cursor: pointer;
    display: block;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 50px;
    color: black;
    font-size: 1.5rem;
    font-weight: normal;
    text-align: center;
    line-height: 50px;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    border-radius: 3px;
    opacity: 1;
}
.modal-footer button:nth-child(2) {
    background-color: #ffffff !important;
    color: black !important;
    border: 1px solid #cccccc;
    font-weight: normal;
    opacity: 1;
}