@charset "utf-8";

/***************************************************
PC用および共通設定 974px～
***************************************************/
*{
/*	font-size:105% !important;*/
}
#container {
  position: relative;
}

main {
  position: relative;
}

.text-left{
	text-align:left !important;
}
.large{font-size:110%;}

.main_image{
	background:url("../images/main_pc.jpg") center top;
	background-size:cover;
	height:426px;
	position:relative;
}
/*言語選択*/
.main_image ul.language{
	position:absolute;
	display:flex;
	justify-content: space-between;
	padding:20px 5px 0 60px;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	width:350px;
	top:0;
	left:50%;	
}



.wrp_white{
	width:100%;
	background:#FFF;
}


.left_cnt{
	float:left;
	margin:0 20px 0 0;
	width:150px;
}
.right_cnt{
	float:left;
	width:490px;
}

#fixed_menu {
  width: 100%;
  z-index: 100000;
}
h3{
	width:35%;
}
h3 img{
	width:100%;
}


/*メニュー*/
.bg_menu{
	background:#000000;
	padding:0;
	margin:0;
	z-index: 10000;
	position:relative;
	width:100%;
	text-align:center;
	height:110px;
	border-top:#A78000 3px solid;
	border-bottom:#DCC98E 3px solid;
	box-shadow: 3px 3px 2px 1px rgb(0 0 0 / 20%);
}

#menu{
	width:950px;
	margin:0 auto 0;
	height:60px;

}
#menu img{
	vertical-align:middle;
}
#menu ul{
/*	display:flex;
	justify-content: space-between;
	padding:13px 0;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;*/
	width:750px;
	margin:auto;
}

#menu ul li{
	width:26%;
	float:left;
	text-align:center;
	margin-right:2%;
	margin-top:1.5%;
}

#menu ul li:first-child{
	width:16%;
	margin-right:2%;
	margin-top:0;
}
#menu ul li:nth-child(4),#menu ul li:nth-child(7){
	margin-right:0;
}

#menu ul li a{
	display:block;
}
#menu ul li a img{
	width:100%;
}

.fixed {
    position: fixed;
    top: 0;
    width: 100%;
}

.box{
	width:970px;
	margin:auto;
}

/*wrp_bg01 電気ブランとは*/
#wrp_bg01{
	background:url("../images/back_about.jpg") repeat;
	width:100%;
}

#box_bg01{
	padding:5% 2%;
	display:flex;
	justify-content: space-between;
	flex-wrap:wrap;
    -webkit-justify-content: center;
    justify-content: center;

}
#box_bg01 h2{
	width:38%;
	margin-right:5%;
}

#box_bg01 div{
	width:47%;
	padding-top:3%;
}
#box_bg01 h2 img{
	width:100%;
}

/*wrp_bg02 歴史*/
h2{
	text-align:center;
	margin-bottom:3%;
}
#wrp_bg02{
	background:url("../images/back_his.jpg") repeat center top;
}
#box_bg02{
	padding:5% 0;
}	

#box_bg02 table{
	width:100%;
	margin:3% 0;
	background:url("../images/line.png") repeat-y 6% 20px;
}


#box_bg02 table th{
	width:14%;
	padding:0 2% 0 0;
}
#box_bg02 table th img{
	width:100%;
}

#box_bg02 table td{
	width:84%;
	vertical-align:top;
	padding:2%;
	background:#FFF;
	border:2px solid #61171B;

}
#box_bg02 table td.space{
	background:none;
	border:none;
	padding:3%;
}
.tl_bg02{
	font-size:130%;
	color:#61171B;
	font-weight:bold;
	padding-bottom:0.5rem;
	border-bottom:1px dashed #61171B;
	margin-bottom:1rem;

}
.flex{
	display:flex;
	flex-wrap:wrap;
    -webkit-justify-content: center;
    justify-content: center;

}
.box0101_bg02{
	width:65%;
	margin-right:3%
}
.box0102_bg02{
	width:32%;
}
.box0102_bg02 img{
	width:100%;
}
#box_bg02 .banner{
	margin-top:3%;
}
.box02_bg02{
	margin-top:3%;
	width:100%;
	background:#CED1D3;
	display:flex;
	padding:2%;
}
.box0201{
	width:25%;
	margin-right:3%;
}
.box0201 img{
	width:100%;
}

.box0202{
	width:72%;
}
#box_bg02 .button{
	margin-top:3%;
}
p.note{
	font-size:80%;
	margin-top:0.5rem !important;
}



/*wrp_bg03 文豪*/
span.red{
	color:#FF0000;
	text-decoration:underline;
	font-weight:bold;
}
p.right{
	text-align:right;
	font-weight:bold;

}
#wrp_bg03{
	background:url("../images/back_writerloved02.jpg") repeat center top;

}
#box_bg03{
	padding:5% 3%;
}
#box_bg03 ul{
	display:flex;
	justify-content: space-between;
	flex-wrap:wrap;
    -webkit-justify-content: center;
    justify-content: center;
	margin-top:3%;
}
#box_bg03 ul li{
	height:100%;
	width:45%;
	margin:1%;
	padding:2%;
	background:url("../images/back_writerloved01.jpg") repeat center top;
	box-shadow: 2px 2px 4px 3px rgba(0, 0, 0, 0.1);
}
#box_bg03 ul li p{
  background-color: #fee088; /* 背景色 */
  background-image: linear-gradient(90deg, transparent 0%, transparent 50%, #fee088 50%, #fee088 100%), /* 点線1の色 */
                    linear-gradient(0deg, #61171B 0%, #61171B 1px, transparent 1px, transparent 100%); /* 点線2の色と太さ */
  background-size: 8px 100%, /* 点線1のサイズ */
                   100% 2em; /* 点線2のサイズ */
  line-height: 2em; /* 文字の高さ */
  /*padding-bottom: 1px;*/ /* 最終行の下にも罫線を引く */
}



/*wrp_bg04　楽しみ方*/
#wrp_bg04{

	background:#d6cfc2;
	text-align:center;
}
#box_bg04{
	margin:auto;
	padding:5% 3%;
}
#box_bg04 h2{
	width:60%;
	margin:0 auto 6%;
}
#box_bg04 h2 img{
	width:100%;
}
#box_bg04 h3{
	margin:6% auto 2%;

}
#box_bg04 ul.menu{
	display:flex;
	justify-content: space-between;
	flex-wrap:wrap;
    -webkit-justify-content: center;
    justify-content: center;
	width:80%;
	margin:3% auto;

}
#box_bg04 ul.menu li{
	width:48%;
	margin:1%;
}
#box_bg04 ul.menu li img{
	width:100%;
}
#box_bg04 ul.enjoy{
	display:flex;
	justify-content: space-between;
	flex-wrap:wrap;
	-webkit-justify-content: center;
	justify-content: center;
	width:100%;
	margin:3% auto;

}
#box_bg04 ul.enjoy li{
	width:48%;
	margin:1%;
	text-align:left;
	padding:2% 1% 3%;
	border-top:1px solid #61171B;
}
#box_bg04 ul.enjoy li .tl_enjoy{
	width:50%;
	margin:2% 50% 2% 0;
}
#box_bg04 ul.enjoy li .img_enjoy{
	width:48%;
	margin:0 2% 0 0;
	float:left;
}
#box_bg04 ul.enjoy li span{
	width:50%;
	margin:0 2% 0 0;

}
#box_bg04 ul.enjoy li img{
	width:100%;
}
#box_bg04 ul.enjoy li:nth-child(5),#box_bg04 ul.enjoy li:nth-child(6){
	border-bottom:1px solid #61171B;
}
#box_bg04 ul.enjoy li .box_wariai{
	width:100%;
	background:#FFF;
	margin:2% 0;
	padding:2%;
}
#box_bg04 ul.enjoy li .box_wariai .tl_wariai{
	background:#864B3B;
	color:#FFF;
	padding:0.5% 1%;
	margin:1% 0;
	width:98%;
	font-size:95%;
}
#box_bg04 ul.enjoy li .box_wariai p{
	color:#864B3B;
	font-size:95%;
}

#box_bg04 ul.movie{
	display:flex;
	justify-content: space-between;
	flex-wrap:wrap;
	-webkit-justify-content: center;
	justify-content: center;
	width:100%;
	margin:3% auto;
}
#box_bg04 ul.movie li{
	width:45%;
	margin:0 2.5%;

}
#box_bg04 ul.movie li .youtube_frame{
  position: relative;
  width: 100%;
  padding-top: 100%;
}
#box_bg04 ul.movie li .youtube_frame iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
p.note_movie{
	margin:2% auto !important;
	color:#61171B;

}
#box_bg04 ul.insta{
	display:flex;
	justify-content: space-between;
	flex-wrap:wrap;
	-webkit-justify-content: left;
	justify-content: left;
	width:100%;
	margin:3% auto;
}
#box_bg04 ul.insta li{
	width:19%;
	margin:2% 0.5% 0;

}
#box_bg04 ul.insta li img{
	width:100%;
}

.btn_more {
	cursor:pointer;
    margin: 6% auto 0;
    color: #61171B;
    font-size: 120%;
    font-weight: bold;
}
/*wrp_bg05 楽しめるお店*/
#wrp_bg05{

	background:#FFE9DF;
	text-align:center;
}
#box_bg05{
	margin:auto;
	padding:5% 3%;
}
#box_bg05 .box_map{
  position: relative;
  width: 100%;
  padding-top: 70%;
	margin:0 auto 1%;
}
#box_bg05 .box_map iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
#box_bg05 p.title{
	font-size:130%;
	font-weight:bold;
	color:#61171B;
	text-align:left;
	margin:3% auto 1% !important;
}
p.note_map{
	text-align:left;
}
p.note_map2{
	text-align:left;
	font-size:90%;
}

.fixed_menu_filler {
  position: relative;
  margin: 0;
  padding: 0;
  height: 0;
}

/*wrp_bg06 商品ラインアップ*/
#wrp_bg06{

	background:#FFF9E7;
	text-align:center;
}
#box_bg06{
	margin:auto;
	padding:5% 3%;
}

ul.lineup{
	display:flex;
	justify-content: space-between;
	flex-wrap:wrap;
	-webkit-justify-content: center;
	justify-content: center;
	width:100%;
	margin:3% auto;
}
ul.lineup li{
	width:41%;
	margin:2% 2%;
	padding:2%;
	background:#FFF;
	box-shadow: 0px 0px 2px 3px rgba(0, 0, 0, 0.1);

}
ul.lineup li img{
	width:100%;
	border:1px solid #969696;
}
#box_bg06 ul.lineup p{
	color:#61171B;
	font-size:120%;
	font-weight:bold;
	margin:5% auto !important;
}
#box_bg06 ul.lineup a{
	display:block;
	background:#61171B;
	color:#FFF;
	padding:2% 0;
}
#box_bg06 ul.lineup a:hover{
	text-decoration:none;
}

/***************************************************
タブレット用 768px～973px
***************************************************/

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

/*menu*/

.fixed_menu{
	height:100%;
}
.bg_menu{
	height:100%;
}
#menu{
	width:100%;
	height:100%;
}
#menu ul li {
	text-align:center;
}
#menu ul li img{
	width:80%;
	margin:auto;

}
.box{
	width:100%;
}

/*おすすめバナー*/




}
/***************************************************
スマートフォン用 ～767px
***************************************************/
@media only screen and (max-width: 767px){

.br-pc{display:none;}
.mt3_sp{margin-top:3%;}
.sp_center{text-align:center;}

p{
	text-align:left;
}
h3{
	width:45%;
}
.large{font-size:100%;}

/*KV*/
.main_image{
	height:100%;
}
/*言語選択*/
.main_image ul.language{
	position:absolute;
	display:flex;
	justify-content: space-between;
	padding:0;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	width:100%;
	top:0;
	left:0;	
}
.main_image ul.language li{
	width:33.333%;
}
.main_image ul.language li img{
	width:100%;
}


/*menu*/
/*SP用メニュー*/
.menu_sp {
  background-color: black;
  z-index: 1000;
		box-shadow: 3px 3px 2px 1px rgb(0 0 0 / 20%);
	position:relative;

}
#menu_logo_sp{

}
.menu_sp #menu_logo{
	float:left;
	width:12%;
	margin:1%;
}
.menu_sp #menu_pulldown{
	float:right;
	width:70%;
	margin:1% 0;

}

.fixed {
    position: fixed;
    top: 0;
    width: 100%;
}

.fixed_menu{
	height:100%;
}
.bg_menu{
	height:100%;
}
#menu{
	width:100%;
	height:100%;
}
#menu ul li {
	text-align:center;
}
#menu ul li img{
	width:80%;
	margin:auto;

}

h3{
	font-size:120%;
}
/*wrp_bg01 電気ブランとは*/

#box_bg01{
	padding:3% 2%;
	display:block;

}
#box_bg01 h2{
	width:50%;
	margin:auto;
}
#box_bg01 div{
	width:100%;
	padding-top:2%;
}
#box_bg01 h2 img{
	width:100%;
}

/*wrp_bg02*/

#box_bg02{
	width:96%;
	margin:auto;
	padding-bottom:4%;
}
#box_bg02 table{
	width:100%;
	margin:3% 0;
	background:url("../images/line.png") repeat-y 8.5% 20px;
}


#box_bg02 table th{
	width:19%;
	padding:0 2% 0 0;
}
#box_bg02 table th img{
	width:100%;
}

#box_bg02 table td{
	width:79%;
	vertical-align:top;
	padding:2%;
	background:#FFF;
	border:2px solid #61171B;

}
#box_bg02 table td.space{
	background:none;
	border:none;
	padding:4%;
}
.tl_bg02{
	font-size:130%;
	color:#61171B;
	font-weight:bold;
	padding-bottom:0.5rem;
	border-bottom:1px dashed #61171B;
	margin-bottom:1rem;

}
.flex{
	display:block;


}
.box0101_bg02{
	width:100%;
	margin-right:0
}
.box0102_bg02{
	width:100%;
	text-align:center;
}
.box0102_bg02 img{
	width:60%;
	margin:4% auto 2%;
}
p.note{
	width:60%;
	margin:auto;
	text-align:left;
}
#box_bg02 .banner{
	width:80%;
	margin:4% auto;

}
.box02_bg02{
	margin-top:3%;
	width:100%;
	background:#CED1D3;
	display:flex;
	padding:2%;
}
.box0201{
	width:25%;
	margin-right:3%;
}
.box0201 img{
	width:100%;
}

.box0202{
	width:72%;
}
#box_bg02 .button{
	margin:4% auto;
	width:90%;
}


/*wrp_bg03*/
#box_bg03 ul li{
	height:100%;
	width:100%;
	margin:2%;
	padding:4%;
}

/*wrp_bg04　楽しみ方*/

#box_bg04{
	margin:auto;
	padding:3%;
}
#box_bg04 h2{
	width:95%;
	margin:0 auto 6%;
}
#box_bg04 h2 img{
	width:100%;
}
#box_bg04 h3{
	margin:6% auto 3%;

}
#box_bg04 ul.menu{
	width:100%;
	margin:3% auto;

}
#box_bg04 ul.menu li{

}
#box_bg04 ul.menu li img{
	width:100%;
}
#box_bg04 ul.enjoy{
	display:block;
	width:100%;
	margin:3% auto;

}
#box_bg04 ul.enjoy li{
	width:100%;
	margin:1%;
	text-align:left;
	padding:2% 1% 3%;
	border-top:1px solid #61171B;
}
#box_bg04 ul.enjoy li .tl_enjoy{
	width:50%;
	margin:2% 50% 2% 0;
}
#box_bg04 ul.enjoy li .img_enjoy{
	width:40%;
	margin:0 2% 0 0;
	float:left;
}
#box_bg04 ul.enjoy li span{
	width:58%;
	margin:0 2% 0 0;

}
#box_bg04 ul.enjoy li img{
	width:100%;
}
#box_bg04 ul.enjoy li:nth-child(5){
	border-bottom:none;
}
#box_bg04 ul.enjoy li:nth-child(6){
	border-bottom:1px solid #61171B;
}

#box_bg04 ul.movie li{
	width:100%;
	margin:2% 0;

}
#box_bg04 ul.insta li{
	width:32%;
	margin:1% 0.5% 0;

}
.btn_more {
	display:inline-block;
    margin: 0 auto 0;
    color: #61171B;
    font-size: 120%;
    font-weight: bold;
}


p.note_movie{
	text-align:center;
}

/*wrp_bg06 商品ラインアップ*/


ul.lineup li{
	width:49%;
	margin:2% 0;
}
ul.lineup li:first-child{
	margin-right:2%;
}


#box_bg06 ul.lineup p{
	font-size:110%;
	text-align:center;
}


}