@charset "utf-8";
:root {
	--black: #000000;
	--font: #333333;
	--white: #ffffff;
	--red: #ff4b00;	/* red 防火、禁止、停止、危険、緊急 */
	--yellowred: #f6aa00;	/* yellowred 注意警告、明示 */
	--yellow: #f2e700;	/* yellow 注意警告、注意、明示 */
	--green: #00b06b;	/* green 安全状態、進行、完了・稼働中 */
	--blue: #1971ff;	/* blue 指示、誘導、安全状態、完了・稼働中 */
	--purple: #990099;	/* purple 放射能、極度の危険 */
	
	--red1: #FF0000;
	--red3: #cc0000;
	--red5: #ff6666;
	--red7: #ff9999;
	--red9: #ffe0e0; /* パステル */
    --blue1: #0000FF; /* blue */
    --blue3: #0000cc;
    --blue5: #0066ff;	
    --blue7: #99ffff;
    --blue9: #e0ffff; /* パステル */
    --purple1: #4b0082;	/* indigo */
    --purple2: #800080;	/* purple */
    --green1: #008000;	/* GREEN */
	--green3: #006600;
	--green5: #00cc00;
	--green7: #ccff99;
	--green9: #e0ffe0; /* パステル */
	--yellow1: #FFFF00;	/* YELLOW */
	--yellow3: #ffff33;
	--yellow5: #ffff66;
	--yellow5: #ffff99;
	--yellow9: #ffffe0; /* パステル */
   	--gray1: #333333;
	--gray3: #666666;
	--gray5: #999999;
	--gray7: #cccccc;
	--gray9: #F5F5F5;	/* whitemoke */
}
 
* {
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	text-decoration-skip-ink: none; /* chrome アンダーバー対応 */
}


html {
   font-size: 62.5%;
   font-size: 10px;
}

body {
	line-height: 1.5;
/*	font:13px/1.7 "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;*/
/*	font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;*/
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: var(--font);
	background: var(--white);
/*	overflow-x:hidden;*/ /* sticky 動作せず　*/
	
	-webkit-print-color-adjust: exact;

	font-size: 1.3rem;

	/* footer */
	min-height: 100vh;
	display: flex;
	flex-direction: column;
  
	padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);

}

h1, h2, h3, h4, h5, h6, p, em, div, form, table, button, input, select, textarea {
	font-family: inherit;
}

img {
	border: none;
}

input[type='radio'],
input[type='checkbox']
{
	vertical-align: middle;
}

a,
button {
	cursor: pointer;
	text-decoration: none;
	border: none;
	font-weight: bold;
	line-height: inherit;
	display: inline-block;
	vertical-align: middle;
}

li {
	list-style-type: none;
}





.success_message {
	text-align: center;
	color: var(--blue1);
	font-weight: 700;
}
.error_message {
	text-align: center;
	color: var(--red1);
	font-weight: 700;
}
.caution_message {
	text-align: center;
	color: var(--yellow3);
	font-weight: 700;
}
.normal_message {
	text-align: center;
	color: var(--green);
	font-weight: 700;
}





/* for swiper */
.swiper-3d .swiper-cube-shadow,
.swiper-3d .swiper-slide,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-wrapper{
	transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
}




/* カレンダー用 */
.holiday_color {
	color: var(--red1);
}
.saturday_color {
	color: var(--blue1);
}



.text-c {
	text-align: center;
}
.text-r {
	text-align: right;
}

/* ------------------- { Header } ----------------------- */
.header {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 99;
/*    background-color: WHITE;*/
    background-color: var(--green1);
   	position: fixed;	
}

.header .headline {
	max-width: 1200px;
	width: 99%;
	margin: 0 auto;
	display: flex;
	align-items: center;
}
@media screen and (orientation: landscape) {
	.header .headline {
		padding-left: 20px;
		padding-right: 20px;
	}
}

/* Hamburger Menu */
.headline .drawer {
	display: none;
}


/* ------------------- { Header Contents } ----------------------- */
.headline .logo #logo_suzuran {
	height: 35px;
	margin: 5px 10px 0 5px;
	fill: var(--white);
}

.headline .header_menu {
/*    max-width: 500px;*/
    width: 100%;
	margin-left: auto;
/*        border: 1px solid BLACK;*/
}

.headline .header_menu .menu {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
/*	justify-content: center;*/
}
.header_menu .menu .menu_single {
    height: 20px;
    line-height: 20px;
   	text-align: center;
   	color: var(--white);
    border-right: 1px solid var(--white);
    width: 20.0%;	/* 5メニュー */
}
.header_menu .menu > li:first-child {
    border-left: 1px solid var(--white);
}
.header_menu .menu .menu_single a {
    display: block;
    color: var(--white);
   	font-weight: 500;
}
.header_menu .menu .menu_single a:hover {
	text-decoration: underline;
}
.header_menu .menu .menu_single button {
	color: var(--white);
	background-color: transparent;
	font-weight: 500;
}  
.header_menu .menu .menu_single button:hover {
	text-decoration: underline;
}


.header_menu .menu .menu_second-level {
	position: absolute;
	top: 100%;
	min-width: 20%;
	white-space: nowrap;
    background: var(--green1);
/*    background: rgba(240, 255, 240, 0.95);	/* HONEYDEW */
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
}
.header_menu .menu .menu_single:hover > ul {
    top: 100%;
    visibility: visible;
    opacity: 1;
}
.header_menu .menu .menu_single .menu_second-level {
    visibility: hidden;
    opacity: 0;
    z-index: 1;

}
.header_menu .menu .menu_single .menu_second-level li {
    border-top: 1px solid WHITE;
}
.header_menu .menu .menu_single .menu_second-level a {
	margin: 10px;
	text-align: left;
    color: WHITE;
}
.header_menu .menu .menu_single .menu_second-level a:hover {
	text-decoration: underline;
}
.header_menu .menu > li:last-of-type ul {
	right: 0;
}

/* 未使用
ul.menu_third-level {
    visibility: hidden;
    opacity: 0;
}
ul.menu_fourth-level {
    visibility: hidden;
    opacity: 0;
}
.menu_third-level li a:hover {
    background: #2a1f1f;
}

.menu_fourth-level li a:hover {
    background: #1d0f0f;
}
*/

@media screen and (max-width: 630px) {
	.header .logo #logo_suzuran {
		height: 28px;
		margin-left: 10px;
	}
	.headline .header_menu {
		display: none;	
	    opacity: 0;
	}
	.headline .drawer {
		display: block;
	    opacity: 1;
	    margin-left: auto;
/*	    width: 100%;*/
/*	    border: 1px solid WHITE;*/
	}	
}


/* ------------------- { Footer } ----------------------- */

#Footer {
	width: 100%;
	background-color: var(--green1);
	margin-top: auto;
	
/*	position: fixed;*/
/*	bottom: 0;
	left: 0;
	right: 0;
/*	display: flex;*/
/*	padding-bottom: env(safe-area-inset-bottom);*/
}
#Footer .menu {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	padding: 3px 0;	
}	
#Footer .menu a {
/*	display: inline-block;*/
	border-right: 1px solid var(--white);
	color: var(--white);
	font-size: 1.2rem;
	font-weight: normal;
	padding: 0 6px;
}
#Footer .menu a:last-child {
	border-right: none;
}
#Footer .menu a:hover {
	text-decoration: underline;
}
#Footer .address {
	text-align: center;
	color: var(--white);
	font-size: 1.2rem;
	background-color: var(--green1);
	padding: 3px 0;
}
#Footer .address > span {
	display: inline-block;
}

#Copyright {
	width: 100%;
	padding: 5px 0 3px 0;
	text-align: center;
	background: var(--green1);
	color: var(--white);
	font-size: 1.2rem;
}
@media screen and (max-width: 630px) {
	#Footer .address,
	#Copyright {
		font-size: 1.1rem;	
	}
}	

	
/* ------------------- { Hamburger Menu } ----------------------- */

/* チェックボックス、メニューを非表示 */
.drawer .drawer-hidden {
	display: none;
}
.drawer .drawer-list,
.drawer .drawer-list .drawer-item_second-level {
    display: none;
    opacity: 0;
}

/* ハンバーガーアイコンの設置スペース */
.drawer .drawer-open {
	display: flex;
	top: 0;
	right: 10px;
	height: 30px;
	width: 36px;
	justify-content: center;
	align-items: center;
	z-index: 999;
	position: relative;
	cursor: pointer;
	background: transparent;
	margin-left: auto;
}

.drawer-open span,
.drawer-open span:before,
.drawer-open span:after {
	content: '';
	display: block;
	height: 3px;
	width: 25px;
	border-radius: 3px;
	background: WHITE;
	transition: 0.3s;
	position: absolute;
}
.drawer-open:hover {
	opacity: 0.55;
/*	background-color: HONEYDEW;
	color: GREEN;
	cursor: pointer;*/
}

/* 三本線のうち一番上の棒の位置調整 */
.drawer-open span:before {
	bottom: 8px;
}

/* 三本線のうち一番下の棒の位置調整 */
.drawer-open span:after {
	top: 8px;
}

/* アイコンがクリックされたら真ん中の線を透明にする */
#drawer-check:checked ~ .drawer-open span {
	background: rgba(255, 255, 255, 0);
}

/* アイコンがクリックされたらアイコンが×印になように上下の線を回転 */
#drawer-check:checked ~ .drawer-open span::before {
	bottom: 0;
	transform: rotate(45deg);
}

#drawer-check:checked ~ .drawer-open span::after {
	top: 0;
	transform: rotate(-45deg);
}

/* メニューのデザイン*/
.drawer-list {
	height: 100%;
	z-index: 999;
	position: fixed;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
	top: 0;
/*  left: 100%;/* メニューを画面の外に飛ばす */
	right: 0;
	background-color: var(--green3);
/*  background-color: transparent; */
	transition: .3s;
}

.drawer-list li > li:last-of-type {
	margin-bottom: 45px;	/* 見切れ */
}

/* ハンバーガーメニューがクリックされた時 */
#drawer-check:checked ~ .drawer-list {
	display: block;
    opacity: 1;
   	top: 40px;
/*	right: 0;*/
}
#drawer-item01:checked ~  ul.drawer-item_second-level,
#drawer-item02:checked ~  ul.drawer-item_second-level,
#drawer-item03:checked ~  ul.drawer-item_second-level,
#drawer-item04:checked ~  ul.drawer-item_second-level,
#drawer-item05:checked ~  ul.drawer-item_second-level,
#drawer-item06:checked ~  ul.drawer-item_second-level {
	display: block;
    top: 100%;
    opacity: 1;
    position: relative;
    width: 100%;
}

.drawer-item .first-level,
.drawer-item a,
.drawer-item button {
	display: inline-block;
	padding: 12px 15px 12px 15px;
	font-size: 1.3rem;
	color: var(--white);
	background-color: transparent;
	font-weight: 500;
	width: 100%;
	text-align: left;
}


.drawer-item_second-level a,
.drawer-item_second-level button {
	width: 100%;
	background-color: var(--green3);
	padding-left: 25px;
}
.drawer-item:hover {
	background-color: var(--green5);
}
.drawer-item > label:hover {
    cursor: pointer;
}
.drawer-item_second-level a:hover,
.drawer-item_second-level button:hover {
	background-color: var(--green5);
}
.drawer-bar {
	border:1px inset var(--green9);
	width: 100%;
}


/* ------------------- { Contents } ----------------------- */

.contents {
	padding-top: 50px;
	max-width: 1200px;
	width: 99%;
	margin: 0 auto;
	color: var(--font);
	font-size: 1.5rem;
	text-align: center;
}
@media screen and (max-width: 630px) {
	.contents {
		width: 97%;
		padding-top: 40px;
		font-size: 1.3rem;
	}
}


.contents .titleBox {

	margin-bottom: 2.0rem;
}
.contents .titleBox .title {
	display: flex;
	align-items: center; /* 垂直中心 */
	justify-content: center; /* 水平中心 */
	font-size: 3.0rem;
	font-weight: 700;
	color: var(--green1);
}

.contents .titleBox .title:before,
.contents .titleBox .title:after {
	content: "";
	flex-grow: 1; /* 横幅いっぱい */
	height: 3.0px; /* 横線の高さ */
	background-color: var(--green1);
}
.contents .titleBox .title:before {
	margin-right: 2.5rem; /* 文字の右隣 */
}
.contents .titleBox .title:after {
	margin-left: 2.5rem; /* 文字の左隣 */
}
.contents .titleBox .subTitle {
	font-size: 1.8rem;
	font-weight: 500;
	color: var(--green1);
}
@media screen and (max-width: 630px) {
	.contents .titleBox {
		margin-bottom: 1.0rem;
	}
	.contents .titleBox .title {
		font-size: 2.0rem;
	}
	.contents .titleBox .title:before,
	.contents .titleBox .title:after {
		height: 2.0px; 
	}
	.contents .titleBox .subTitle {
		font-size: 1.3rem;
	}	
}




/* TOPICS */
.contents .topics {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-top;
}
.contents .topics .topicsBox {
	margin: 1.0rem 1.0rem 0rem 1.0rem;
	padding: 1.0rem;
	border: 1px solid var(--gray7);
	width: 270px;
}
.contents .topics .topicsBox a {
	color: var(--font);
	font-weight: 500;
}
.contents .topics .topicsBox a:hover {
    opacity: 0.8;
}
.contents .topics .topicsBox a > img {
	width: 100%;
}
/*
.contents .topics .topicsBox a > img:hover {
    opacity: 0.55;
}
*/
.contents .topics .topicsBox .topicsTitle {
	font-weight: 550;
}
.contents .topics .topicsBox .topicsTrailer {
	color: var(--white);
	background-color: var(--green);
	margin-right: 0.5rem;
	font-weight: 500;
	padding: .1rem .5rem;
}
.contents .topics .topicsBox .topicsDescription,
.contents .topics .topicsBox .topicsComment {
	font-size: 1.3rem;
}
.contents .topics .topicsBox .topicsCreatedDt {
	color: var(--gray3);
	margin-top: 0.5rem;
	font-size: 1.2rem;
}
@media screen and (max-width: 630px) {
	.contents .topics .topicsBox {
		margin: 1.0rem 1.0rem;
		width: 200px;
	}
	.contents .topics .topicsBox .topicsDescription,
	.contents .topics .topicsBox .topicsComment {
		font-size: 1.1rem;
	}	
}	






/* STORE LIST */
.contents .storeList {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-top;
}
.contents .storeList .storeBox {
	margin: 1.0rem 1.0rem;
	padding: 1.0rem;
	border: 1px solid var(--gray7);
	width: 350px;
	height: 320px;
}
.contents .storeList .storeBox a {
	color: var(--font);
	font-weight: 500;
}
.contents .storeList .storeBox a:hover {
    opacity: 0.8;
}
.contents .storeList .storeBox a > img {
	width: 100%;
}

.contents .storeList .storeBox span {
    display: inline-block;
}

.contents .storeList .storeBox .storeName {
	font-weight: 550;
}
@media screen and (max-width: 630px) {
	.contents .storeList .storeBox {
		margin: 1.0rem 1.0rem;
		width: 200px;
		height: auto;
	}	
}	




/*
.contents .title {
	font-size: 2.4rem;
	font-weight: 700;
	color: var(--green1);
	margin: 20px 10px 0 10px;
}
*/

/*
.contents .title_bar {
	border-top: 2.6px solid var(--green1);
	margin-bottom: 10px;
}
*/

/*
.contents .border_bar {
	border-top: 1.5px solid SILVER;
	margin-bottom: 5px;
}
.contents .title_error {
	font-size: 1.8rem;
	color: RED;
	margin-left: 5px;
}
.contents .title_bar_error {
	border-top: 2px solid RED;
	margin-bottom: 10px;
}
*/


.contents .topics table {
	width: 100%;
}
.contents .topics td {
	font-size: 1.4rem;
	padding: 5px;
}
/*
.contents .topics a {
	color: BLACK;
	font-weight: normal;
}
/*
.contents .topics a:hover {
	text-decoration: underline;
}
*/

.contents .information {
	color: var(--font);
	background-color: var(--gray9);
/*	line-height: 3.0rem;*/
}
.contents .information .chk--contents {
	display: none;
	opacity: 0;
}
.contents .information .lbl--contents {
	display: block;	/* 幅いっぱい */
	position: relative;
	font-size: 1.5rem;
	font-weight: 500;
	padding: .5rem 0 .5rem 2.5rem;

}
.contents .information .lbl--contents:hover {
	background-color: var(--gray3);
}
.contents .information .content {
	margin-top: 1.0rem;
	padding: 0 1.0rem;
	display: none;
	opacity: 0;
}
.contents .information .chk--contents:checked + .lbl--contents + .content {
	display: block;
	opacity: 1;
}

.contents .information .sub_title {
	font-size: 1.3rem;
	font-weight: 700;
	margin-top: 1.0rem;
}
.contents .information li {
	font-size: 1.3rem;
	margin-top: .3rem;
}
.contents .information .tab {
	margin-left: 2.0rem;
}
.contents .information .right {
	text-align: right;
	margin-right: 2.0rem;
}
/*
.contents .information li:not(:first-child) {
	margin-top: 5.0rem;
}
*/
.contents .information td:first-child {
	padding-left: 1.0rem;
	padding-right: 2.0rem;
}
@media screen and (max-width: 630px) {
	.contents .information .lbl--contents {
		font-size: 1.3rem;
	}
	.contents .information .content {
		margin-top: 0.5rem;
		padding: 0 1.0rem;
	}
	.contents .information .sub_title {
		font-size: 1.2rem;
	}
	.contents .information li {
		font-size: 1.2rem;
	}
	/*
	 .contents .information li:not(:first-child) {
		margin-top: 3.0rem;
	}
	*/	
}

.contents .information .lbl--contents:after,
.contents .information .lbl--contents:before {
	content: "";
	position: absolute;
	left: 1.0rem;
	top: 1.0rem;
	width: 0.2rem;
	height: 1.0rem;
	background-color: var(--gray1);
	transition: all 0.3s;
}
.contents .information .lbl--contents:after {
	transform: rotate(90deg);
}
.contents .information .chk--contents:checked + .lbl--contents:before {
/*	transform: rotate(90deg);*/
	display: none;
}
@media screen and (max-width: 630px) {
	.contents .information .lbl--contents {
		font-size: 1.3rem;
		padding: .2rem 0 0 2.5rem;
	}
	.contents .information .lbl--contents:after,
	.contents .information .lbl--contents:before {
		top: .6rem;
		width: 0.2rem;
		height: .8rem;
	}

}







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

	
	.contents .title,
	.contents .title_error {
		font-size: 1.6rem;
		margin-top: 10px;
	}

	.contents .topics td {
		display: block;
		padding: 2px 0 2px 5px;
		font-size: 1.2rem;
	}
	.contents .topics  td:last-of-type {
		border-bottom: 1px solid SILVER;
	}

	.contents .information li,
	.contents .store .frame_store a {
		font-size: 1.2rem;
	}
	.contents .store .frame_store a > img {
		max-width: 200px;
	}		
}




/* ------------------- { Slider } ----------------------- */

.swiper_main {
	margin-top: 20px;
}
.swiper_main .swiper-area {
	max-width: 1200px;
	width: 99%;
	margin: 0 auto;
	position: relative;
	overflow: hidden;	/* はみ出し消去 */
}
.swiper_main .swiper-slide {
	height: 380px;
    text-align: center;
}
.swiper_main .swiper-slide a {
	color: var(--font);
	font-weight: 500;
	text-decoration: none;
	font-size: 1.3rem;
}
.swiper_main .swiper-slide a:hover {
	color: var(--gray2);
}
.swiper_main .swiper-slide img {
	width: 100%;
    height: 380px;
    object-fit: contain;
}
.swiper_main .swiper-slide a:hover {
	 opacity: .5;
}

.swiper_main .swiper-button-next:after,
.swiper_main .swiper-button-prev:after {
	color: var(--green1);
}
.swiper_main .swiper-pagination-bullet-active {
	background-color: var(--green1);
}

@media screen and (max-width: 750px) {
	
	.swiper_main .swiper-button-prev,
	.swiper_main .swiper-button-next,
	.swiper_main .swiper-pagination {
		display: none;
	}
	
	.swiper_main {
		margin-top: 5px;
	}
	.swiper_main .swiper-slide,
	.swiper_main .swiper-slide img {
		height: 250px;
	}
	.swiper_main .swiper-slide a {
		font-size: 1.2rem;
	}

}


.swiper_important .important {
	color: var(--green1);
	font-size: 1.6rem;
	text-align: center;
}

.swiper_important .swiper-area {
	position: relative;
	max-width: 800px;
	width: 99%;
	margin: 10px auto;
	overflow: hidden;	/* はみ出し消去 */
}
.swiper_important .swiper {
	text-align: center;
}
.swiper_important .swiper-button-next:after,
.swiper_important .swiper-button-prev:after {
	color: var(--gray1);
	font-size: 2.4rem;
}
.swiper_important .swiper-pagination {
	position: relative;
	margin-top: 20px;
}
.swiper_important .swiper-pagination-bullet-active {
	background-color: var(--font);
}
.swiper_important .item a {
	color: var(--font);
	font-weight: 500;
	text-decoration: underline;
}
.swiper_important .item a:hover {
	font-weight: 700;
}


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

	.swiper_important .swiper-button-prev,
	.swiper_important .swiper-button-next,
	.swiper_important .swiper-pagination {
		display: none;
	}
	
	.drawer {
		display: block;
		margin-left: 10px;
	}
	
	.swiper_important .item {
		font-size: 1.2rem;
	}	

}


@media screen and (max-width: 480px) {
	
	.headline .name {
		display: none;
	}

}



/* ボタン */
.btn--edit {
	color: var(--white);
	background-color: var(--green1);
/*	background-color: DARKOLIVEGREEN;*/
	font-weight: 500;
}
.btn--edit:hover {
	background-color:var(--green5);
/*	background-color: YELLOWGREEN;*/
}

.btn--edit_r {
	color: var(--green1);
	background-color: var(--white);
	font-weight: 500;	
}
.btn--edit_r:hover {
	color: var(--white);
	background-color: var(--green5);
}

.btn--find {
	color: var(--white);
	background-color: var(--green5);
	font-weight: 500;
}
.btn--find:hover {
	background-color: var(--green7);
}
.btn--new {
	color: var(--white);
	background-color: var(--green1);
	font-weight: normal;
}
.btn--new:hover {
	background-color: var(--green5);
}
.btn--next {
	color: var(--white);
	background-color: var(--green1);
	font-weight: normal;
}
.btn--next:hover {
	background-color: var(--green5);
}




.btn--clear {
	color: var(--white);
	background-color: var(--gray5);
	font-weight: normal;
}
.btn--clear:hover {
	background-color: var(--gray7);
}
.btn--return {
	color: var(--white);
	background-color: var(--gray3);
	font-weight: normal;
}
.btn--return:hover {
	background-color: var(--gray7);
}
.btn--sub_next {
	color: var(--white);
	background-color: var(--gray1);
	font-weight: normal;
}
.btn--sub_next:hover {
	background-color: var(--gray5);
}


.btn--special {
	color: var(--white);
	background-color: firebrick;
	font-weight: normal;
}
.btn--special:hover {
	background-color: salmon;
}



/* ------------------- { Arrow } ----------------------- */
/* 下矢印 */
.arrow_u-o {
    content: '';
    display: inline-block;
    width: 7px;
    height: 7px;
    margin: 0 10px 3px 10px;
    border-right: 2px solid;
    border-bottom: 2px solid;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.arrow_o {
  position: relative;
  display: inline-block;
  padding-left: 20px;
  text-decoration: none;
}
.arrow_o:before {
  content: '';
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 2px;
  border-right: solid 2px;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -4px;
  transform: rotate(-45deg);
}
.arrow_u {
  position: relative;
  display: inline-block;
  padding-left: 20px;
  text-decoration: none;
}
.arrow_u:before {
  content: '';
  width: 6px;
  height: 6px;
  border: 0;
  border-bottom: solid 2px;
  border-right: solid 2px;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -6px;
  transform: rotate(45deg);
}
.arrow_r {
  position: relative;
  display: inline-block;
  padding-left: 20px;
  text-decoration: none;
}
.arrow_r:before {
  content: '';
  width: 6px;
  height: 6px;
  border: 0;
  border-bottom: solid 2px;
  border-right: solid 2px;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -6px;
  transform: rotate(-45deg);
}

.arrow_u:hover,
.arrow_o:hover,
.arrow_r:hover {
   	font-weight: bold;
}