@charset "utf-8";
/* CSS Document */

/* reset */
p,table,address,iframe,form,figure,dl {
	margin: 0;
	padding: 0;
}
h1,h2,h3,h4,h5,h6 {
	font-size: inherit;
	font-weight: inherit;
	margin: 0;
	padding: 0;
}
ul,ol {
	margin: 0;
	padding: 0;
	list-style: none;
}
dt {
	font-weight: bold;
}
dd {
	margin-left: 0;
}
a {
	background-color: transparent;
	text-decoration: none;
	color: inherit;
}


/*============= 共通デザイン =============*/
body {
	color: #000000;
	font-size: 16px;
	line-height: 1.7em;	
	letter-spacing: 0.09em;
	margin: 0 auto;
	text-align: center;
	font-family: 'ヒラギノ角ゴ ProN','Lato','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
}
.pc_none {  /* PCでは非表示 */
	display: none;
}
a:hover {
	color: #BB0C13;
}
a img:hover {
	opacity: 0.5 ;
}
.spbr {  /* スマホのみ改行 */
	display: none;
}
.pcbr {  /* pcのみ改行 */
	display: block;
}
section {
	width: 90%;
	max-width: 1200px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 5%;
	margin-left: auto;
}
#mobile_head {
	display: none;
}
.text_left {
	text-align: left;
}
.text_center {
	text-align: center;
}
.text_right {
	text-align: right;
}
.clB{
	clear:both;
}
.mL20{
	margin-left: 20px;
}


.flexarea {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
}
.flex2 {
	width: 50%;
}
.flex2 li img {
	width: 100%;
}
.flexC {
	width: 100%;
}
.flexC li img {
	width: 100%;
	text-align:center;
}


.flex3 {
	width: 32%;
}
.column2 li {  /* 横2列に並べる */
	width: 50%;
}
.column2 li img {
	width: 100%;
}
.gray_box {
	background: #E8E8E8;
	padding: 20px;
	margin: 3% 0;
	text-align: left;
}
a.jump_point { 
	display: block;
	padding-top: 110px;
	margin-top: -110px;
	border: none;
}
.under_space2 {
	margin-bottom: 2%;
}
.under_space5 {
	margin-bottom: 5%;
}
.under_space {
	margin-bottom: 10%;
}
.top_space {
	margin-top: 5%;
}
.right_space {
	margin-right: 20px;
}
.linkline, .vertical_list a {   /*リンク下線 */
	text-decoration: underline;
	text-underline-offset: 5px;
}
.img100 {   /* 画像幅100%表示 */
	width: 100%;
}
.img60 {   /* pc幅100%,モバイル幅50%表示 */
	width: 100%;
}
.img80 {   /* 画像幅50%表示 */
	width: 80%;
}
.img50 {   /* 画像幅50%表示 */
	width: 50%;
}
.bt_small a {   /* 黒い囲い線小さめボタン */
	transition: .1s;
	background: url("../img/icon_right.png") no-repeat 98%;
	display: block;
	width: 200px;
	padding: 10px 0;
	margin: 15px auto;
	border: solid 1px #444444;
}
.bt_small a:hover {
	background: url("../img/icon_rightw.png") no-repeat 98%;
	background-color: #444444;
	color: #fff;
}
.bt_red a {   /* 赤ボタン */
	transition: .1s;
	background-color: #BB0C13;
	display: block;
	width: 250px;
	padding: 10px 0;
	margin: 15px auto;
	border: solid 2px #BB0C13;
	color: #fff;
	font-weight: bold;
}
.bt_red a:hover, .bt_redbig a:hover {
	background-color: #fff;
	color: #BB0C13;
	border: solid 2px #BB0C13;
}
.bt_redbig a {   /* 赤ボタン（大） */
	transition: .1s;
	background-color: #BB0C13;
	display: block;
	width: 50%;
	padding: 22px 0 20px;
	margin: 15px auto;
	border: solid 2px #BB0C13;
	color: #fff;
	font-weight: bold;
	font-size: 1.2em;
}
.bt_redwhite a {   /* 赤ボタン（色反転バージョン） */
	transition: .1s;
	background-color: #fff;
	display: block;
	width: 250px;
	padding: 10px 0;
	margin: 15px auto;
	border: solid 2px #BB0C13;
	color: #BB0C13;
	font-weight: bold;
}
.bt_redwhite a:hover {
	background-color: #BB0C13;
	color: #fff;
	border: solid 2px #BB0C13;
}
.table_simple {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	margin: 2% 0;
	text-align: left;
}
.table_simple dt {
	width: 18%;
	padding: 1%;
	margin-bottom: 5px;
	background: #E8E8E8;
	display: flex;
	align-items: center;
	font-weight: normal;
}
.table_simple dd {
	width: 77%;
	padding: 1%;
	margin-bottom: 5px;
	border-bottom: solid 1px #767676;
	/*display: flex;*/
	align-items: center;
}
.beside_list {  /* 横並び（左寄り）リスト */
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
}
.beside_list li, .center_list li {
	margin: 0 20px 10px 0;
}
.beside_list li a {
	text-decoration: underline;
	text-underline-offset: 5px;
}
.center_list {  /* 横並び（中央）リスト */
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
}
.vertical_list {  /* 縦並びリスト */
	list-style: square;
	margin-left: 20px;
	text-align: left;
}

.beside_list_lp {  /* 横並び（左寄り）リストLP */
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	margin: 20px;
}
.beside_list_lp li {
	margin: 0 20px 10px 0;
}
.beside_list_lp li a {
	text-decoration: underline;
	text-underline-offset: 5px;
}


/* アコーディオン開閉 */
.toggle {
	display: none;
}
.tog_title {
	padding: 10px 30px 10px 10px;
	display: block;
	border: solid 1px #444444;
	text-align: left;
}
.tog_title::before{
	content:"";
	width: 6px;
	height: 6px;
	border-top: 2px solid #444444;
	border-right: 2px solid #444444;
	-webkit-transform: rotate(45deg);
	position: absolute;
	top:calc( 50% - 3px );
	right: 20px;
	transform: rotate(135deg);
}
.tog_title:hover {
	background-color: #D8D8D8;
}
.tog_title, .tog_box .tag_box_lp {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transform: translateZ(0);
	transition: all 0.3s;
}
.tog_box {
	height: 0;
	margin-bottom:10px;
	padding:0 20px;
	overflow: hidden;
	text-align: left;
}
.toggle:checked + .tog_title + .tog_box {
	height: auto;
	padding:20px ;
	transition: all .3s;
}
.toggle:checked + .tog_title::before {
	transform: rotate(-45deg) !important;
}
.tog_title img {
	vertical-align: bottom;
}



/*============= テキストデザイン =============*/

.title_two {   /* 下線付きタイトル */
	/*font-family:"ＭＳ Ｐ明朝",'Lato','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;*/
	font-size: 1.8em;
	margin: 2% 0;
	font-weight: bold;
	line-height: 1.2em;
}
.title_two::before {
	content: attr(data-en);
	display: block;
	color: #BB0C13;
	font-size: 0.7em;
	margin-bottom: 5px;
	font-weight: normal;
}
.title_two::after {
	content: '';
	display: block;
	margin: 10px 35% 5px 0;
	height: 2px;
	background-color: #BB0C13;
}


.title_mark {   /* かぎかっこタイトル */
	font-size: 1.5em;
	position: relative;
	line-height: 1.5;
	padding:0.25em 2em;
	display: inline-block;
	font-weight: bold;
	margin: 2% 0;
}
.title_mark:before, .title_mark:after {
	content:'';
	width: 15px;
	height: 25px;
	position: absolute;
	display: inline-block;
}
.title_mark:before {
	border-left: solid 2px #000;
	border-top: solid 2px #000;
	top:0;
	left: 0;
}
.title_mark:after {
	border-right: solid 2px #000;
	border-bottom: solid 2px #000;
	bottom:0;
	right: 0;
}
.title_line {   /* 背景グレータイトル */
	font-size: 1.3em;
	font-weight: bold;
	margin: 2% 0 1%;
	background: #626262;
	color: #fff;
	padding: 8px;
}
.b_black {
	font-size: 1.1em;
	font-weight: bold;
}
.b_redbig {
	font-size: 2em;
	font-weight: 900;
	line-height:1.5;
}
.b_black15 {
	font-size: 1.5em;
	font-weight: 900;
	line-height:1.5;
}
.b_red {
	color: #BB0C13;
	font-weight: bold;
}
.b_redbig {
	color: #BB0C13;
	font-size: 2em;
	font-weight: 900;
	line-height:1.5;
}
.b_redbig15 {
	color: #BB0C13;
	font-size: 1.5em;
	font-weight: 900;
	line-height:1.5;
}
.b_orange {
	color: #E46712;
	font-size: 1.2em;
	font-weight: 900;
}
.b_orange15 {
	color: #E46712;
	font-size: 1.5em;
	font-weight: 900;
}
.small_red {
	color: #fff;
	background: #BB0C13;
	font-size: 0.7em;
	padding: 0 3px;
}

/*============= ヘッダー =============*/
header {
	width: 100%;
	padding-bottom: 5px;
}
#fix {
	position: fixed;
	width: 100%;
	z-index: 9999;
}
/** 上段ヘッダー（固定） **/
#head_01back {
	width: 100%;
	background: #fff;
}
#head_01 {
	width: 90%;
	max-width: 1200px;
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	margin: 0 auto;
	align-items: flex-end;
	height: 62px;
	padding: 0;
}
h1 {
	margin: 0 auto 0 0;
	padding: 0;
	height: 55px;
}
#guide ul li {
	margin: 0 0 5px 40px;
	display: inline-block;
	position: relative;
}
#guide ul li:before{
	content: "";
    position: absolute;
    top: .6em;
    left: -15px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 5px;
    height: 5px;
    border-top: 2px solid #BB0C13;
    border-right: 2px solid #BB0C13;
}

#cart {
	display: flex;
	flex-flow: row nowrap;
	width: 75px;
	margin: 0 0 4px 40px;
}
#cart img {
	vertical-align: bottom;
	padding: 0 0 5px 0;
}
#cart iframe {
	width: 30px;
	height: 30px;
}

/** ヘッダー中段 **/
#head_02 {
	width: 100%;
	background: #bb0c13;
	height: 42px;
}
#head_02 nav {
	width: 90%;
	max-width: 1200px;
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: center;
	margin: 0 auto;
}
#dropmenu {
	width: 70%;
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
}
.menu_size { /* 文字拡大部分 */
	font-size: 1.3em;
	font-weight: bold;
	padding-right: 2px;
}
#dropmenu > li {
	position: relative;
}
#dropmenu > li > a {
	display: block;
	color: #FFFFFF;
	padding: 11px 0 10px 0;
	width: auto;
	line-height: 1;
}
.init-bottom:after {  /* 下矢印 */
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 0 0 10px;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
#dropmenu > li > a:hover {
	background: linear-gradient(90deg, #bb0c13 0%, #E8797E 50%, #bb0c13 100%);
    transition: all .2s;
}
#dropmenu > li > .accordion, #dropmenu > li > .no_accordion {
	position: absolute;
	z-index: 100;
	top: 100%;	
	left: 0;
	text-align: left;
	background-color: #fff;
	box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
	overflow: hidden;
	height: 0;
}
#dropmenu > li:hover > .accordion,#dropmenu > li:hover > .no_accordion {
	overflow: visible;
	height: auto;
}
.accordion > li, .no_accordion > li {
    margin: 0;
    padding: 0;
	width: 250px;
	border-bottom: dashed 1px #AAAAAA;
}
.accordion > li:last-child, .no_accordion > li:last-child {
	border-bottom: none;
}
.accordion li img, .no_accordion li img {
	width: 40px;
	vertical-align: middle;
	padding-right: 10px;
}
.accordion li label, .no_accordion li a {
    display: block;
    margin: 1px 0;
    padding: 10px 10px 8px;
	line-height: 1.9em;
	cursor: pointer;
}
.accordion li label:hover, .no_accordion li label:hover  {
    color: #BB0C13;
}
.accordion li ul li a{
	border: solid 1px #B1B1B1;
	padding: 5px 30px 3px;
	margin: 0 10px 10px 0;
	background: #E5E5E5 url("../img/icon_right.png") no-repeat right;
}
.accordion li ul li a:hover {
	color: #fff;
	border: solid 1px #232323;
	background: #232323 url("../img/icon_rightw.png") no-repeat right;
}
/** チェックボックス */
.accordion li > [type=checkbox] {
    vertical-align: middle;
    position: absolute;
    left: 0;
    z-index: 1;
    display: none;
}

/** 非チェック時の項目 (スライドアップ・ダウン用) */
.accordion [type=checkbox]:not(:checked) ~ ul > li > label {
    opacity: 0;
    margin: 0;
    padding: 0;
    border-top-width: 0;
    border-bottom-width: 0;
    color: transparent;
    line-height: 0;
    transition: 0.2s margin, 0.2s padding, 0.2s border-width, 0.2s line-height, 0.2s opacity;
}
/** チェック時の項目 (スライドアップ・ダウン用) */
.accordion [type=checkbox]:checked ~ ul > li > label {
    opacity: 1;
    color: inherit;
    transition: 0.2s margin, 0.2s padding, 0.2s border-width, 0.2s line-height, 0.2s opacity;
}

/** 非チェック時の項目 (右端のアイコン) */
.accordion [type=checkbox] ~ label::after {
    content: "";
    float: right;
    color: #666;
    transition: 0.2s all;
	width: 6px;
    height: 6px;
    margin: 13px 0 0 15px;
	border-right: 1px solid #666;
    border-bottom: 1px solid #666;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
/** チェック時の項目 (右端のアイコン) */
.accordion [type=checkbox]:checked ~ label::after {
    transform: rotate(-135deg);
}
.result {
	display: none;
}

/** 検索窓 ***/
#form {
	position: relative;	
}
#sbox {	
	outline: 0;
	height: 23px;	
	padding: 0 5px;	
	width: 60%;
}
#sbtn { 
	width: 50px;
	padding: 3px auto 1px;
	border: none;
}
#sbtn:hover {
	background-color: #767676;
	color: #FFFFFF;
}
/** ヘッダー下段 **/
.mini_menu {
	background: #E8E8E8;
	height: 33px;
	padding-top: 145px;
}
.mini_menu li {
	display: inline-block;
}
.mini_menu li:not(:first-child)::before {
  content: "｜";
}
.mini_menu li a {
	margin: 0;
	padding: 0 10px;
}

.mini_menu2 {
	height: 35px;
	color:#999;
	text-align:center;
}

.mini_menu3 {
	background:#eee;
	height: 35px;
	color:#999;
	display:block;
}
.mini_menu3 span #sptxt {
	text-align:left;
	font-size: 0.7em;
}
.mini_menu3 span #pctxt {
	text-align:center;
}


/*================= フッター ===============*/
footer {
	width: 100%;
	background: #EFEFEF;
	padding: 20px 0 50px;
}
footer dl {
	max-width: 1200px;
	margin: 10px auto 1%;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
}
footer dd {
	width: 40%;
	background: #fff;
	padding: 10px;
	margin: 0 5px;
	border: solid 1px #686868;
}
footer dd p {
	background: #000;
	color: #fff;
	font-weight: bold;
	font-size: 1em;
	padding-bottom: 10px;
	margin-bottom: 10px;
}
footer ul {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
}
footer li {
	padding: 8px 10px;
}
footer li:after {
	content: "|";
	padding-left: 20px;
}
footer li:last-child::after {
	content: "";
	padding-left: 0;
}
footer p{
	font-size: .8em;
	line-height: 1.1rem;
	padding: 10px 5% 0 5%;
}
.footershop {
	max-width: 1015px;
	margin: 1% auto;
}
.footershop img {
	width: 100%;
}

.footerlogo {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	padding: 10px 5% 0 5%;
}

.up a {
	position: fixed;
    right: 2%;
    bottom: 20px;
    height: 50px;
	width: 50px;
	background: #fff;
	border: solid 1px #444444;
	display: flex;
	justify-content: space-between;
	align-items: center;
	transition: 0.2s;
}
.up a::after {
	content: '';
	width: 15px;
	height: 15px;
	border-top: 2px solid #444444;
	border-right: 2px solid #444444;
	transform: rotate(-45deg);
	margin: 8px 0 0 16px;
	transition: 0.2s;
}
.up a:hover {
	background: #444444;
}
.up a:hover::after {
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
}

/*================= メイン =================*/
main {
	text-align: center;
	margin: 0 auto;
	width: 90%;
	max-width: 1200px;
}
#pankuzu {
	display: flex;
	flex-flow: row wrap;
	font-size: .9em;
	margin: 10px 0 20px;
	text-align: left;
	line-height: 1.3em;
}
#pankuzu li {
	margin: 0 10px 5px 0;
}
#pankuzu li a {
	text-decoration: underline;
	text-underline-offset: 2px;
}
#pankuzu li:not(:last-child):after {
	content: "/";
	padding-left: 13px;
}