@charset "UTF-8";

/* ----------------------------------
	ヘッダー＆フッター
---------------------------------- */
#header_include_frame { min-height: 152px;}
#footer_include_frame { min-height: 1000px;}

/* ----------------------------------
	フレーム
---------------------------------- */
.contents--frame { max-width: 1130px; padding: 0 15px; margin: 0 auto 50px;}

@media screen and (min-width: 769px) {
	.contents--frame { margin: 0 auto 60px;}
}

/* ----------------------------------
	見出し
---------------------------------- */
.contents--headline1 { padding: 26px 0 0; margin: 0 0 20px; border: none; font-size: 20px; font-weight: 700; text-align: center; color: var(--site-color-black);}
.contents--headline2 {
  padding: 10px 0;
  margin: 0 0 20px;
  border: none;
  border-bottom: var(--site-color-green) 2px solid;
  font-size: 20px;
  font-weight: 700;
  text-align: left;
  color: var(--site-color-green);
}
.contents--top-text { font-size: 16px; font-weight: 500; line-height: 1.8;}

@media screen and (min-width: 769px) {
	.contents--headline1 { padding: 55px 0 0; margin: 0 0 25px; font-size: 26px;}
	.contents--headline2 { padding: 15px 0; margin: 0 0 30px; font-size: 26px;}
	.contents--top-text  { font-size: 16px; font-weight: 500; text-align: center;}
}

/* ----------------------------------
	ボタン
---------------------------------- */
.contents--button { margin: 30px auto 40px;}
.contents--button .normal-btn {
	max-width: 320px;
	width: 80%;
	min-height: 46px;
	margin: 0 auto;
	border: var(--site-border-solid);
	border-radius: 46px;
	font-size: 16px;
	font-weight: 700;
	color: var(--site-color-black);
	text-align: center;
	text-decoration: none;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	transition: var(--site-transition);
}
.contents--button .normal-btn::before {
	content: '';
	border: var(--site-color-green) 2px solid;
	border-radius: 44px;
	display: block;
	position: absolute;
	top: -1px;
	left: -1px;
	right: -1px;
	bottom: -1px;
	opacity: 0;
	transition: var(--site-transition);
}
.contents--button .normal-btn::after {
	content: '';
	width: 17px;
	height: 17px;
	margin: 0 0 0 5px;
	border-radius: 17px;
	display: block;
	background-color: #FFF;
	background-image: url("../../img/usr/common/ico_arrow_g.png");
	background-repeat: no-repeat;
	-webkit-background-size: 6px auto;
	background-size: 6px auto;
	background-position: center;
	position: absolute;
	top: calc(50% - 8.5px);
	right: 15px;
}
.contents--button .normal-btn:hover::after { background-image: url("../../img/usr/common/ico_arrow_gr.png");}
.contents--button .normal-btn:hover::before { opacity: 1.0;}

@media screen and (min-width: 769px) {
	.contents--button { margin: 40px auto;}
	.contents--button .normal-btn { min-height: 50px; border-radius: 50px; font-size: 18px; font-weight: 700;}
}

/* ----------------------------------
 ページャー
---------------------------------- */
.forcms_block .navipage_total_ { margin: 0 0 30px; font-size: 14px; text-align: center;}
.forcms_block .navipage_total_ span { font-family: var(--site-font-family-price); font-size: 14px; font-weight: 400;}
.forcms_block .navipage_.top_,
.forcms_block .navipage_.bottom_ { margin: 30px 0; font-size: 14px; text-align: center;}
.forcms_block .navipage_.top_ center,
.forcms_block .navipage_.bottom_ center { display: flex; justify-content: center; align-items: center; gap: 10px;}

@media screen and (min-width: 769px) {
	.forcms_block .navipage_total_ { margin: 0 0 40px; font-size: 18px;}
	.forcms_block .navipage_total_ span { font-size: 18px;}
	.forcms_block .navipage_.top_ { margin: 40px 0 30px; font-size: 18px;}
	.forcms_block .navipage_.bottom_ { margin: 40px 0; font-size: 18px;}
}

.forcms_block .navipage_ center { padding: 0 46px;}
.forcms_block .navipage_:has(.navipage_reverse_) center { padding-left: 0;}
.forcms_block .navipage_:has(.navipage_forward_) center { padding-right: 0;}
.forcms_block .navipage_ .navipage_reverse_ { padding: 0; margin: 0 10px 0 0; display: flex; align-items: center; gap: 10px;}
.forcms_block .navipage_ .navipage_forward_ { padding: 0; margin: 0 0 0 10px; display: flex; align-items: center; gap: 10px;}
.forcms_block .navipage_ center > a { 
  width: 36px;
  height: 36px;
	padding: 0 0 3px;
	margin: 0;
	border: #F5F5F5 2px solid;
	border-radius: 36px;
	font-family: var(--site-font-family-price);
	font-size: 17px;
	font-weight: 700;
	text-decoration: none;
	line-height: 1.0;
	color: var(--site-color-black);
	display: flex;
	justify-content: center;
	align-items: center;
	background: #F5F5F5;
	transition: var(--transition);
}
.forcms_block .navipage_ center > a:hover { border: var(--site-color-green) 2px solid; color: var(--site-color-green); background: #FFF; opacity: 1.0;}
.forcms_block .navipage_ .navipage_now_ { 
  width: 36px;
  height: 36px;
	padding: 0 0 3px;
	margin: 0;
	border-radius: 36px;
	font-family: var(--site-font-family-price);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.0;
	color: #FFF;
	display: flex;
	justify-content: center;
	align-items: center;
	background: var(--site-color-green);
}
.forcms_block .navipage_ .navipage_reverse_ span.navipage_first_,
.forcms_block .navipage_ .navipage_reverse_ span.navipage_prev_,
.forcms_block .navipage_ .navipage_forward_ span.navipage_next_,
.forcms_block .navipage_ .navipage_forward_ span.navipage_last_ { width: 36px; height: 36px; background: none;}
.forcms_block .navipage_ .navipage_reverse_ span.navipage_prev_,
.forcms_block .navipage_ .navipage_forward_ span.navipage_next_ { display: none !important;}
.forcms_block .navipage_ .navipage_reverse_ .navipage_first_ a,
.forcms_block .navipage_ .navipage_reverse_ .navipage_prev_ a,
.forcms_block .navipage_ .navipage_forward_ .navipage_next_ a,
.forcms_block .navipage_ .navipage_forward_ .navipage_last_ a { 
	width: 100%;
	height: 100%;
	border-radius: 36px;
	font-size: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #F5F5F5;
	background-repeat: no-repeat;
	box-shadow: none;
	position: relative;
}
.forcms_block .navipage_ .navipage_reverse_ .navipage_first_ a::before,
.forcms_block .navipage_ .navipage_reverse_ .navipage_prev_ a::before,
.forcms_block .navipage_ .navipage_forward_ .navipage_next_ a::before,
.forcms_block .navipage_ .navipage_forward_ .navipage_last_ a::before {
  content: '';
	width: 17px;
	height: 17px;
	margin: 0;
	display: block;
	background-color: transparent;
	background-image: url("../../img/usr/common/ico_arrow.png");
	background-repeat: no-repeat;
	-webkit-background-size: 6px auto;
	background-size: 6px auto;
	background-position: center;
}
.forcms_block .navipage_ .navipage_reverse_ .navipage_first_ a::after,
.forcms_block .navipage_ .navipage_forward_ .navipage_last_ a::after { display: none !important;}
.forcms_block .navipage_ .navipage_reverse_ .navipage_first_ a::before { transform: rotate(-180deg);}

/* ----------------------------------
 Navigation
---------------------------------- */
.navigation-frame { padding: 30px 15px; margin: 0 0 50px; background: #FAF7F0;}
.navigation-frame .navigation-list { width: 100%; display: flex; flex-wrap: wrap; gap: 10px;}
.navigation-frame .navigation-list li {
	width: calc(50% - 5px);
	min-height: 70px;
	padding: 0;
	margin: 0;
	border: var(--site-border-solid);
	border-radius: 10px;
	font-size: 15px;
	font-weight: 400;
	text-decoration: none;
	line-height: 1.2;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	background: #fff;
	position: relative;
	transition: var(--site-transition);
}
.navigation-frame .navigation-list li a {
	width: 100%;
	height: 100%;
	padding: 0 35px 0 10px;
	font-size: 15px;
	font-weight: 400;
	text-align: left;
	text-decoration: none;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	background: transparent;
}
.navigation-frame .navigation-list li:has(a) { padding: 0 !important;}
.navigation-frame .navigation-list li a::before,
.navigation-frame .navigation-list li.is-curent a::before {
	content: '';
	border: var(--site-color-green) 2px solid;
	border-radius: 10px;
	display: block;
	position: absolute;
	top: -1px;
	left: -1px;
	right: -1px;
	bottom: -1px;
	opacity: 0;
	transition: var(--site-transition);
}
.navigation-frame .navigation-list li a::after {
	content: '';
	width: 17px;
	height: 17px;
	padding: 0;
	margin: 0;
	border-radius: 17px;
	display: block;
	background-color: var(--site-color-green);
	background-image: url("../../img/usr/common/ico_arrow_w.png");
	background-repeat: no-repeat;
	-webkit-background-size: 6px auto;
	background-size: 6px auto;
	background-position: center;
	position: absolute;
	top: calc(50% - 8.5px);
	right: 10px;
}
.navigation-frame .navigation-list li:has(a):hover { color: var(--site-color-green);}
.navigation-frame .navigation-list li:has(a):hover a::before { opacity: 1.0;}
.navigation-frame .navigation-list li.is-curent a::before { opacity: 1.0;}
.navigation-frame .navigation-list li.is-curent a { font-weight: 700; color: var(--site-color-green);}

@media screen and (min-width: 769px) {
	.navigation-frame { padding: 60px 15px; margin: 0 0 60px; background: #FAF7F0;}
	.navigation-frame .navigation-list { max-width: 1000px; width: 100%; margin: 0 auto; gap: 20px;}
	.navigation-frame .navigation-list li { width: calc((100% - 20px * 2)/3); min-height: 80px; font-size: 18px;}
	.navigation-frame .navigation-list li a { padding: 0 40px 0 20px; font-size: 18px;}
	.navigation-frame .navigation-list li a::after { right: 20px;}
}

/* ----------------------------------
 CAMPAIGN PICKUP [共通ブロック]
---------------------------------- */
#contents_campaign_pickup { display: none;}
body:has(.smzpreview-preview-content) #contents_campaign_pickup,
#contents_campaign_pickup:has(.campaign-box) { display: block;}
#contents_campaign_pickup { padding: 30px 15px; background: var(--site-color-cream);}
#contents_campaign_pickup .campaign-container { width: 100%; padding: 25px 15px; margin: 0 auto; border-radius: 10px; background: #FFF;}
#contents_campaign_pickup .campaign-container h2 { text-align: center;}
#contents_campaign_pickup .campaign-container .campaign-list { display: flex; flex-wrap: wrap; gap: 30px 15px; gap: 15px;}
#contents_campaign_pickup .campaign-container .campaign-box { width: calc((100% - 15px * 1)/2); margin: 0;}
#contents_campaign_pickup .campaign-container .campaign-box a,
#contents_campaign_pickup .campaign-container .campaign-box .nolink { width: 100%; text-decoration: none; display: flex; flex-direction: column; transition: var(--site-transition);}
#contents_campaign_pickup .campaign-container .campaign-box a:hover { text-decoration: none; opacity: var(--site-opacity);}
#contents_campaign_pickup .campaign-container .campaign-box .image { width: 100%; padding: 100% 0 0; margin: 0; position: relative;}
#contents_campaign_pickup .campaign-container .campaign-box .image figure {
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	border: var(--site-border-solid);
	border-radius: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	overflow: hidden;
}
#contents_campaign_pickup .campaign-container .campaign-box .image figure img { max-width: 100%; max-height: 100%; vertical-align: top; transition: var(--site-transition);}
#contents_campaign_pickup .campaign-container .campaign-box a:hover .image figure img { transform: scale(1.1,1.1);}
#contents_campaign_pickup .campaign-container .campaign-box .block-icon,
#contents_campaign_pickup .campaign-container .campaign-box .date,
#contents_campaign_pickup .campaign-container .campaign-box .name { display: none;}
#contents_campaign_pickup .campaign-container .campaign-box:nth-child(n+5) { display: none;}

@media screen and (min-width: 769px) {
	#contents_campaign_pickup { padding: 50px;}
	#contents_campaign_pickup .campaign-container { max-width: 1200px; padding: 30px 50px; margin: 0 auto; border-radius: 10px; background: #FFF;}
	#contents_campaign_pickup .campaign-container .campaign-list { display: flex; flex-wrap: wrap; gap: 20px;}
	#contents_campaign_pickup .campaign-container .campaign-box { width: calc((100% - 20px * 2)/3); margin: 0;}
	#contents_campaign_pickup .campaign-container .campaign-box .image { margin: 0 0 15px;}
}
@media screen and (min-width: 1199px) {
	#contents_campaign_pickup .campaign-container .campaign-box { width: calc((100% - 20px * 3)/4); margin: 0;}
}

/* ----------------------------------
 FAQ
---------------------------------- */
.faq-box-frame .faq-box { border: var(--site-border-solid); border-radius: 10px;}
.faq-box-frame .faq-box + .faq-box { margin-top: 15px;}
.faq-box-frame .faq-box .faq-q { padding: 16px 45px 16px 70px; font-size: 16px; font-weight: 500; display: flex; align-items: center; position: relative; cursor: pointer;}
.faq-box-frame .faq-box .faq-q .q-number { font-size: 18px; font-weight: 700; color: var(--site-color-green); position: absolute; top: 15px; left: 16px;}
.faq-box-frame .faq-box .faq-q .icon {
  width: 23px;
  height: 23px;
  border-radius: 23px;
  background: var(--site-color-green);
  position: absolute;
  top: calc(50% - 11.5px);
  right: 16px;
  transition: var(--site-transition);
}
.faq-box-frame .faq-box .faq-q .icon::before,
.faq-box-frame .faq-box .faq-q .icon::after {
	content: '';
	width: 10px;
	border-top: #FFF 2px solid;
	display: block;
	position: absolute;
	top: calc(50% - 1px);
	left: calc(50% - 5px);
	transition: var(--site-transition);
}
.faq-box-frame .faq-box .faq-q .icon::after { transform: rotate(90deg);}
.faq-box-frame .faq-box .faq-q.is-open .icon { background: var(--site-color-light);}
.faq-box-frame .faq-box .faq-q.is-open .icon::before,
.faq-box-frame .faq-box .faq-q.is-open .icon::after { border-top: var(--site-color-green) 2px solid;}
.faq-box-frame .faq-box .faq-q.is-open .icon::after { transform: rotate(0deg);}
.faq-box-frame .faq-box .faq-a { padding: 16px 0 16px 54px; margin: 0 16px; border-top: var(--site-border-dotted); display: none; position: relative;}
.faq-box-frame .faq-box .faq-a .a-number { font-size: 18px; font-weight: 700; color: var(--site-color-pink); position: absolute; top: 15px; left: 0;}
.faq-box-frame .faq-box .faq-a .faq-a-inner {}
.faq-box-frame .faq-box .contant-edt-elements-wrap { margin-bottom: 0;}

@media screen and (min-width: 769px) {
	.faq-box-frame .faq-box .faq-q { padding: 24px 70px 24px 90px; font-size: 22px;}
	.faq-box-frame .faq-box .faq-q .q-number { font-size: 22px; position: absolute; top: 22px; left: 24px;}
	.faq-box-frame .faq-box .faq-q .icon { width: 30px; height: 30px; border-radius: 30px; top: calc(50% - 15px); right: 30px;}
	.faq-box-frame .faq-box .faq-q .icon::before,
	.faq-box-frame .faq-box .faq-q .icon::after { width: 12px; left: calc(50% - 6px);}
	.faq-box-frame .faq-box .faq-a { padding: 24px 0 24px 60px; margin: 0 30px; display: none;}
	.faq-box-frame .faq-box .faq-a .a-number { font-size: 18px; font-weight: 700; color: var(--site-color-pink); position: absolute; top: 22px;}
}

/* ----------------------------------
 お問い合わせ窓口 [共通ブロック]
---------------------------------- */
dl.inquiry-window { border: var(--site-border-solid); border-radius: 10px;}
dl.inquiry-window + dl.inquiry-window { margin-top: 15px;}
dl.inquiry-window dt { padding: 16px 62px 16px 22px; font-size: 16px; font-weight: 500; display: flex; align-items: center; position: relative; cursor: pointer;}
dl.inquiry-window dt::before {
	content: '';
	width: 33px;
	height: 33px;
	margin: 0 15px 0 0;
	display: block;
	background-color: transparent;
	background-image: url("../../img/usr/common/ico_drugstore.png");
	background-repeat: no-repeat;
	background-position: center;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
}
dl.inquiry-window#type_drugstore dt::before  { background-image: url("../../img/usr/common/ico_drugstore.png");}
dl.inquiry-window#type_onlineshop dt::before { background-image: url("../../img/usr/common/ico_onlineshop.png");}
dl.inquiry-window dt .icon {
  width: 23px;
  height: 23px;
  border-radius: 23px;
  background: var(--site-color-green);
  position: absolute;
  top: calc(50% - 11.5px);
  right: 16px;
  transition: var(--site-transition);
}
dl.inquiry-window dt .icon::before,
dl.inquiry-window dt .icon::after {
	content: '';
	width: 10px;
	border-top: #FFF 2px solid;
	display: block;
	position: absolute;
	top: calc(50% - 1px);
	left: calc(50% - 5px);
	transition: var(--site-transition);
}
dl.inquiry-window dt .icon::after { transform: rotate(90deg);}
dl.inquiry-window dt.is-open .icon { background: var(--site-color-light);}
dl.inquiry-window dt.is-open .icon::before,
dl.inquiry-window dt.is-open .icon::after { border-top: var(--site-color-green) 2px solid;}
dl.inquiry-window dt.is-open .icon::after { transform: rotate(0deg);}
dl.inquiry-window dd { padding: 16px 0; margin: 0 16px; border-top: var(--site-border-dotted); display: none;}
dl.inquiry-window dd .contact-btn { padding: 0 15px; margin: 0 auto 24px; text-align: center;}
dl.inquiry-window dd .contact-btn .btn a {
	width: 100%;
	height: 60px;
	border-radius: 60px;
	border: var(--site-color-pink) 1px solid;
	font-size: 16px;
	font-weight: 700;
	text-align: center;
	text-decoration: none;
	color: var(--site-color-pink);
	display: flex;
	justify-content: center;
	align-items: center;
	background: #FFF;
	transition: var(--site-transition);
}
dl.inquiry-window dd .contact-btn .btn a:hover { color: #FFF; background: var(--site-color-pink);}
dl.inquiry-window dd .contact-btn .note { padding-left: 1em; margin: 10px 0 0; text-indent: -1em; font-size: 14px; text-align: center;}
dl.inquiry-window dd .contact-tel { text-align: center;}
dl.inquiry-window dd .contact-tel .contact-tel-number { font-family: var(--site-font-family-price); display: flex; justify-content: center; align-items: center;}
dl.inquiry-window dd .contact-tel .contact-tel-number a {
  font-family: var(--site-font-family-price);
  font-size: 28px;
  font-weight: 700;
  text-decoration: none;
  color: var(--site-color-pink);
  display: flex;
  align-items: center;
}
dl.inquiry-window dd .contact-tel .contact-tel-number a::before {
	content: '';
	width: 24px;
	height: 24px;
	margin: 0 10px 0 0;
	display: block;
	background-color: transparent;
	background-image: url("../../img/usr/common/ico_phone.png");
	background-repeat: no-repeat;
	background-position: center;
	-webkit-background-size: auto 100%;
	background-size: auto 100%;
}
dl.inquiry-window dd .contact-tel .contact-tel-time { margin: 10px 0 0; font-size: 14px; text-align: center;}

@media screen and (min-width: 769px) {
	dl.inquiry-window dt { padding: 24px 70px 24px 30px; font-size: 22px;}
	dl.inquiry-window dt .icon { width: 30px; height: 30px; border-radius: 30px; top: calc(50% - 15px); right: 30px;}
	dl.inquiry-window dt .icon::before,
	dl.inquiry-window dt .icon::after { width: 12px; left: calc(50% - 6px);}
	dl.inquiry-window dd { padding: 24px 0; margin: 0 30px; display: none;}
	dl.inquiry-window dd .contact-details { width: 100%; display: flex; justify-content: center; align-items: center;}
	dl.inquiry-window dd .contact-btn { width: 50%; min-width: 50%; margin: 0 auto 0 0;}
	dl.inquiry-window dd .contact-btn .btn a { height: 70px; border-radius: 70px; font-size: 20px;}
	dl.inquiry-window dd .contact-btn .note { font-size: 16px;}
	dl.inquiry-window dd .contact-tel { width: 45%;}
	dl.inquiry-window dd .contact-tel .contact-tel-number a { font-size: 34px; letter-spacing: -0.05em; cursor: default; pointer-events: none;}
	dl.inquiry-window dd .contact-tel .contact-tel-number a::before { width: 36px; height: 36px;}
	dl.inquiry-window dd .contact-tel .contact-tel-time { font-size: 16px;}
}
@media screen and (min-width: 999px) {
	dl.inquiry-window dd { padding: 24px 50px;}
	dl.inquiry-window dd .contact-tel .contact-tel-number a { letter-spacing: 0;}
}

/* ----------------------------------
 詳細ページ
---------------------------------- */
.contents--container { width: 100%; padding: 0 15px 25px; margin: 0; box-sizing: border-box;}
.contents--container .article-headline-frame { padding: 25px 0 0;}
.contents--container .article-headline-frame .block-frame { margin: 0 0 10px; display: flex; gap: 10px 15px;}
.contents--container .article-headline-frame .block-date { font-size: 12px; font-weight: 700; text-align: left; color: var(--site-color-black);}
.contents--container .article-headline-frame .contents--headline1 { padding: 0;}
.contents--container .article-headline-frame .article-headline-green {
	padding: 10px 15px;
	margin: 10px auto 30px;
	border-radius: 5px;
	font-size: 20px;
	color: var(--site-color-green);
	display: flex;
	justify-content: center;
	align-items: center;
	background: var(--site-color-light);
}
.contents--container .article-body-frame img { max-width: 100%;}
.contents--container .article-body-frame .block-image:has(img) { margin: 0 0 20px; text-align: center;}
.contents--container .article-body-frame .block-image img { width: 100%; border-radius: 10px;}

@media screen and (min-width: 769px) {
	.contents--container { max-width: 1360px; padding: 0 50px 40px; margin: 0 auto;}
	.contents--container .column-detail-container { max-width: 1360px; padding: 0 50px 40px; margin: 0 auto;}
	.contents--container .article-headline-frame { padding: 55px 0 0;}
	.contents--container .article-headline-frame .block-date { font-size: 16px;}
	.contents--container .article-headline-frame .contents--headline1 { padding: 0;}
	.contents--container .article-headline-frame .article-headline-green { padding: 12px 20px; margin: 15px auto 50px; border-radius: 10px; font-size: 26px;}
	.contents--container .article-body-frame .block-image:has(img) { margin: 0 0 40px;}
}

/* ----------------------------------
 テンプレート TEXT
---------------------------------- */
.field-tmplse strong,
.base-box strong { color: inherit; font-weight: 700; font-style: inherit;}

.template-style-text .base-box { margin-bottom: 20px;}
.base-box h2.base-ttl {
	padding: 0 0 10px;
	margin: 0 0 10px;
	border-bottom: var(--site-color-green) 2px solid;
	font-size: 20px;
	font-weight: 700;
	text-align: left;
	color: var(--site-color-green);
	background: none;
}
.base-box h3.base-ttl {
	padding: 0;
	margin: 0 0 10px;
	border: none;
	font-size: 18px;
	font-weight: 700;
	text-align: left;
	color: var(--site-color-green);
	background: none;
}
.base-box h4.base-ttl {
	padding: 0;
	margin: 0 0 10px;
	border: none;
	font-size: 16px;
	font-weight: 700;
	text-align: left;
	color: var(--site-color-black);
	background: none;
}
.base-box .text { font-size: 16px; line-height: 1.6;}
.base-box .text + .text { margin-top: 5px;}

@media screen and (min-width: 769px) {
	.template-style-text .base-box { margin-bottom: 40px;}
	.base-box h2.base-ttl { margin: 0 0 15px; font-size: 26px;}
	.base-box h3.base-ttl { margin: 0 0 15px; font-size: 22px;}
	.base-box h4.base-ttl { margin: 0 0 15px; font-size: 18px;}
	.base-box .text { line-height: 1.8;}
}

/* ----------------------------------
 テンプレート IMAGE
---------------------------------- */
.template-style-image .base-box { margin-bottom: 20px; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px;}
.base-box .image { margin: 0 auto; text-align: center;}
.base-box .image img { max-width: 100%; vertical-align: top;}
.base-box.column01 .image { width: 100%;}
.base-box.column02 .image { width: calc((100% - 10px)/ 2);}
.base-box.column03 .image { width: calc((100% - 10px * 2)/ 3);}
.base-box.column04 .image { width: calc((100% - 10px)/ 2);}

@media screen and (min-width: 769px) {
	.template-style-image .base-box { margin-bottom: 40px; gap: 24px;}
	.base-box.column02 .image { width: calc((100% - 24px)/ 2);}
	.base-box.column03 .image { width: calc((100% - 24px * 2)/ 3);}
	.base-box.column04 .image { width: calc((100% - 24px * 3)/ 4);}
}

/* ----------------------------------
 テンプレート NAV
---------------------------------- */
.template-style-nav { margin-bottom: 20px;}
.template-style-nav .nav-list { width: 100%; display: flex; flex-wrap: wrap; gap: 10px;}
.template-style-nav .nav-list .nav-list-item {
	width: calc(50% - 5px);
	height: 60px;
	min-height: 60px;
	padding: 0;
	margin: 0;
	border: var(--site-border-solid);
	border-radius: 10px;
	font-size: 15px;
	font-weight: 400;
	text-decoration: none;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	background: #fff;
	position: relative;
	transition: var(--site-transition);
}
.template-style-nav .nav-list .nav-list-item a {
	width: 100%;
	height: 100%;
	padding: 0 35px 0 10px;
	font-size: 15px;
	font-weight: 400;
	text-align: left;
	text-decoration: none;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	background: transparent;
}
.template-style-nav .nav-list .nav-list-item:has(a) { padding: 0 !important;}
.template-style-nav .nav-list .nav-list-item a::before {
	content: '';
	border: var(--site-color-green) 2px solid;
	border-radius: 10px;
	display: block;
	position: absolute;
	top: -1px;
	left: -1px;
	right: -1px;
	bottom: -1px;
	opacity: 0;
	transition: var(--site-transition);
}
.template-style-nav .nav-list .nav-list-item a::after {
	content: '';
	width: 17px;
	height: 17px;
	padding: 0;
	margin: 0;
	border-radius: 17px;
	display: block;
	background-color: var(--site-color-green);
	background-image: url("../../img/usr/common/ico_arrow_w.png");
	background-repeat: no-repeat;
	-webkit-background-size: 6px auto;
	background-size: 6px auto;
	background-position: center;
	position: absolute;　
	top: calc(50% - 8.5px);
	right: 10px;
	transform: rotate(90deg);
}
.template-style-nav .nav-list .nav-list-item a.other::after { transform: rotate(0deg);}
.template-style-nav .nav-list .nav-list-item:has(a):hover { color: var(--site-color-green);}
.template-style-nav .nav-list .nav-list-item:has(a):hover a::before { opacity: 1.0;}

@media screen and (min-width: 769px) {
	.template-style-nav { margin-bottom: 40px;}
	.template-style-nav .nav-list { width: 100%; margin: 0 auto; gap: 20px;}
	.template-style-nav .nav-list .nav-list-item { width: calc((100% - 20px * 3)/4); height: 80px; min-height: 80px; font-size: 18px;}
	.template-style-nav .nav-list .nav-list-item a { padding: 0 40px 0 20px; font-size: 18px;}
	.template-style-nav .nav-list .nav-list-item a::after { right: 20px;}
}

/* ----------------------------------
 テンプレート LIST
---------------------------------- */
.template-style-list { margin-bottom: 20px;}
.base-box .list-box { padding: 15px; border-radius: 10px; background: #FFF;}
.base-box .list-box.green { background: var(--site-color-light);}
.base-box .list-box .list { width: 100%;}
.base-box .list-box .list + .list { margin-top: 10px;}
.base-box .list-box .list .list-item { padding: 0 0 0 1em; font-size: 14px; font-weight: 400; text-indent: -1em; list-style: disc inside; display: list-item;}
.base-box .list-box .list .list-item.title { font-weight: 700;}
.base-box .list-box .list .list-item a { text-decoration: underline;}

@media screen and (min-width: 769px) {
	.template-style-list { margin-bottom: 40px;}
	.base-box .list-box .list .list-item { font-size: 16px;}
}

/* ----------------------------------
 テンプレート BUTTON
---------------------------------- */
.template-style-button .base-box { margin-bottom: 20px; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px;}
.base-box .link-button { width: 100%;}
.base-box .link-button a {
	width: 100%;
	height: 46px;
	padding: 0 30px;
	border-radius: 46px;
	border: var(--site-border-solid);
	font-size: 16px;
	font-weight: 700;
	color: var(--site-color-black);
	text-decoration: none;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #FFF;
	position: relative;
	transition: var(--site-transition);
}
.base-box .link-button a:hover { border: var(--site-color-green) 1px solid; color: var(--site-color-green);}
.base-box .link-button a::after {
	content: '';
	width: 17px;
	height: 17px;
	padding: 0;
	margin: 0;
	border-radius: 17px;
	display: block;
	background-color: transparent;
	background-image: url("../../img/usr/common/ico_arrow_g.png");
	background-repeat: no-repeat;
	-webkit-background-size: 6px auto;
	background-size: 6px auto;
	background-position: center;
	position: absolute;
	top: calc(50% - 8.5px);
	right: 10px;
	transition: var(--site-transition);
}
.base-box .link-button a:hover::after { background-image: url("../../img/usr/common/ico_arrow_gr.png");}

.base-box .link-button.green a { border: var(--site-color-green) 2px solid; color: #FFF; background: var(--site-color-green);}
.base-box .link-button.green a:hover { border: var(--site-color-green) 2px solid; color: var(--site-color-green); background: #FFF;}
.base-box .link-button.green a::after { background-image: url("../../img/usr/common/ico_arrow_w.png");}
.base-box .link-button.green a:hover::after { background-image: url("../../img/usr/common/ico_arrow_gr.png");}

.base-box .back-link a { text-decoration: underline; display: flex; align-items: center; gap: 5px;	transition: var(--site-transition);}
.base-box .back-link a::before {
	content: '';
	width: 17px;
	height: 17px;
	padding: 0;
	margin: 0;
	border-radius: 17px;
	display: block;
	background-color: var(--site-color-green);
	background-image: url("../../img/usr/common/ico_arrow_w.png");
	background-repeat: no-repeat;
	-webkit-background-size: 6px auto;
	background-size: 6px auto;
	background-position: center;
	transform: rotate(-180deg);
}
.base-box .back-link a:hover { opacity: var(--site-opacity);}

@media screen and (min-width: 769px) {
	.template-style-button .base-box { margin-bottom: 40px; gap: 20px;}
	.base-box .link-button { width: 320px;}
	.base-box .link-button a { height: 50px;}
}

/* ----------------------------------
 テンプレート COLUMN PAGE
---------------------------------- */
.template-style-columnpage .base-box { margin-bottom: 20px;}
.template-style-columnpage .base-box .image { width: 600px; margin: 0 auto 15px; text-align: center;}
.template-style-columnpage .base-box .index-frame { padding: 15px; border-radius: 10px; background: var(--site-color-light);}
.template-style-columnpage .base-box .index-frame h2.c-heading-h3 { margin-bottom: 20px;}
.template-style-columnpage .base-box .index-link-list li { list-style: none; display: list-item;}
.template-style-columnpage .base-box .index-link-list li::before { display: none !important;}
.template-style-columnpage .base-box .index-link-list li .number { font-size: 18px}
.template-style-columnpage .base-box .index-link-list li.class01 { padding: 0; margin: 25px 0 0;}
.template-style-columnpage .base-box .index-link-list li.class01 a { font-weight: 700;}
.template-style-columnpage .base-box .index-link-list li.class02 { padding: 0 0 0 calc(18px + 1em); margin: 10px 0 0; text-indent: -1em; list-style: disc inside !important;}
.template-style-columnpage .base-box .index-link-list li.class02 a { font-weight: 400;}
.template-style-columnpage .base-box .base-box-inbox { margin-top: 20px;}
.template-style-columnpage .base-box .base-box-inbox .ttl { margin: 0 0 10px; font-size: 16px; font-weight: 700;}
.template-style-columnpage .base-box .supervisor-frame {
	padding: 10px;
	margin: 15px auto;
	border: var(--site-border-solid);
	font-size: 14px;
	color: var(--site-color-black);
	background: #FFF;
	box-shadow: 2px 2px 4px #dddddd;
}
.template-style-columnpage .base-box .supervisor-frame-top { display: flex; align-items: center; gap: 20px;}
.template-style-columnpage .base-box .supervisor-frame-top + .supervisor-frame-bottom { margin-top: 10px;}
.template-style-columnpage .base-box .supervisor-frame-top .image { width: 200px; margin: 0;}
.template-style-columnpage .base-box .supervisor-frame-top .name dl { display: flex; flex-wrap: wrap;}

@media screen and (min-width: 769px) {
	.template-style-columnpage .base-box { margin-bottom: 40px;}
	.template-style-columnpage .base-box .image { margin: 0 auto 25px;}
	.template-style-columnpage .base-box .index-frame { padding: 30px;}
	.template-style-columnpage .base-box .index-frame h2.c-heading-h3 { margin-bottom: 30px;}
	.template-style-columnpage .base-box .index-link-list li .number { font-size: 24px}
	.template-style-columnpage .base-box .index-link-list li.class02 { padding: 0 0 0 calc(24px + 1em);}
	.template-style-columnpage .base-box .base-box-inbox { margin-top: 30px;}
	.template-style-columnpage .base-box .base-box-inbox .ttl { font-size: 18px;}
	.template-style-columnpage .base-box .supervisor-frame { padding: 20px; font-size: 16px;}
}

/* ----------------------------------
 テンプレート STORE
---------------------------------- */
.template-style-store { margin: 40px 0;}
.template-style-store .table-title { margin: 0 0 15px; font-size: 16px; font-weight: 700; color: var(--site-color-black);}
.template-style-store .table-frame { width: 100%; border: var(--site-border-solid); border-collapse: collapse;}
.template-style-store .table-frame a { text-decoration: underline;}
.template-style-store .table-frame a:hover { text-decoration: none;}
.template-style-store .table-frame th { padding: 10px; border: var(--site-border-solid); border-collapse: collapse; font-size: 14px; font-weight: 700; background: var(--site-color-light);}
.template-style-store .table-frame td { padding: 10px; border: var(--site-border-solid); border-collapse: collapse; font-size: 14px;}
.template-style-store .message { margin-top: 10px; font-size: 16px;}

@media screen and (min-width: 769px) {
	.template-style-store { margin: 80px 0;}
	.template-style-store .table-title { font-size: 18px;}
	.template-style-store .message { margin-top: 15px; font-size: 16px;}
	.template-style-store .table-frame th { padding: 15px 26px; font-size: 16px;}
	.template-style-store .table-frame td { padding: 15px 26px; font-size: 16px;}
}

/* ----------------------------------
 テンプレート APP
---------------------------------- */
.template-style-app { margin: 40px 0;}
.template-style-app .download-app-head { font-size: 18px; font-weight: 700; color: var(--site-color-green);}
.template-style-app .download-app-frame-wrap { padding: 1px; border-radius: 8px; display: flex; justify-content: center; flex-wrap: wrap; flex-direction: column; background: #F3F9F5;}
.template-style-app .download-app-frame-wrap .download-app-frame { width: calc(100% - 40px); padding: 20px 0; margin: 0 auto;}
.template-style-app .download-app-frame-wrap .download-app-frame + .download-app-frame { border-top: #D8D8D8 1px solid;}
.template-style-app .download-app-title { margin: 0 0 18px; font-size: 16px; font-weight: 700; text-align: center; color: var(--site-color-black);}
.template-style-app .download-applinks { display: flex; justify-content: center; align-items: center; gap: 20px;}
.template-style-app .download-applinks .download-app-link { max-width: 195px;}
.template-style-app .download-applinks .download-app-qr { max-width: 100px;}

@media screen and (min-width: 769px) {
	.template-style-app { margin: 80px 0;}
	.template-style-app .download-app-head { font-size: 22px;}
	.template-style-app .download-app-frame-wrap { flex-direction: row;}
	.template-style-app .download-app-frame-wrap .download-app-frame { width: 50%; padding: 0 30px; margin: 50px auto;}
	.template-style-app .download-app-frame-wrap .download-app-frame + .download-app-frame { border-top: none; border-left: #D8D8D8 1px solid;}
	.template-style-app .download-app-title { margin: 0 0 25px; font-size: 18px;}
	.template-style-app .download-applinks { gap: 30px;}
}

/* ----------------------------------
 コンテンツレイアウト [エレメント]
---------------------------------- */
.contant-edt-elements-wrap { margin: 0 0 30px;}
.contant-edt-elements-wrap [class^="contant-edt-el"] strong { color: inherit; font-weight: 700; font-style: inherit;}
.contant-edt-elements-wrap [class^="contant-edt-el"][data-name="html"] {}
.contant-edt-elements-wrap [class^="contant-edt-el"][data-name="text"] {}
.contant-edt-elements-wrap [class^="contant-edt-el"][data-name="title"] {}
.contant-edt-elements-wrap [class^="contant-edt-el"][data-name="image"] { text-align: center;}
.contant-edt-elements-wrap [class^="contant-edt-el"][data-name="movie"] { width: 100%; padding: 56.25% 0 0; margin-left: auto; margin-right: auto; position: relative;}
.contant-edt-elements-wrap [class^="contant-edt-el"][data-name="movie"] iframe {
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	border: var(--site-border-solid);
	border-radius: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	overflow: hidden;
}
.contant-edt-elements-wrap [class^="contant-edt-el"][data-name="spacer"] {}
.contant-edt-elements-wrap [class^="contant-edt-el"][data-name="line"] {}
.contant-edt-elements-wrap [class^="contant-edt-el"][data-name="button"] { display: flex; justify-content: center; align-items: center;}
.contant-edt-elements-wrap [class^="contant-edt-el"][data-name="button"] > a {
	width: 80%;
	min-height: 56px;
	padding: 5px 15px;
	margin: 0;
	border: var(--site-color-green) 1px solid;
	border-radius: 56px;
	font-size: 16px;
	font-weight: 700;
	text-align: center;
	text-decoration: none;
	white-space: normal;
	color: #FFF;
	display: flex;
	justify-content: center;
	align-items: center;
	background: var(--site-color-green);
	transition: var(--site-transition);
}
.contant-edt-elements-wrap [class^="contant-edt-el"][data-name="button"] > a:hover { color: var(--site-color-green); background: #FFF;}

@media screen and (min-width: 769px) {
	.contant-edt-elements-wrap { margin: 0 0 60px;}
	.contant-edt-elements-wrap [class^="contant-edt-el"][data-name="button"] > a { width: 300px;}
	.contant-edt-elements-wrap [class^="contant-edt-el"][data-name="movie"] { width: 640px; padding: 360px 0 0;}	
}