@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&family=M+PLUS+1p:wght@100;300;400;500;700;800;900&family=M+PLUS+Rounded+1c:wght@100;300;400;500;700;800;900&family=Sawarabi+Mincho:wght@400&family=Sawarabi+Gothic:wght@400&family=Kosugi+Maru:wght@400&family=Kosugi:wght@400&family=Yusei+Magic:wght@400&family=Hachi+Maru+Pop:wght@400&family=Potta+One:wght@400&family=DotGothic16:wght@400&family=RocknRoll+One:wght@400&family=Stick:wght@400&family=Shippori+Mincho:wght@400;500;600;700;800&family=Reggae+One:wght@400&family=Dela+Gothic+One:wght@400&family=Rampart+One:wght@400&family=Kiwi+Maru:wght@300;400;500&family=Kaisei+Tokumin:wght@400;500;700;800&family=Yomogi:wght@400&family=Train+One:wght@400&display=swap');
/*3.全体背景色:*/
#main { background: #ffffff;}
/*4.ヘッダー背景画像 */
/*5. ヘッダーマスク色*/
.header_mask{ background-color: rgba(255,255,255,0); min-height:100vh;}
.header_other_mask{ background-color: rgba(255,255,255,0); min-height:30vh;}
/*7.トップ以外ヘッダー背景画像 */
#header_other { background : url(../img/181_2_photo_2.jpg) no-repeat bottom center;}
/*11.メニュー背景色*/
.menu-wrapper,.menu-wrapper-topfix { background: rgb(229,229,229); background: rgba(229,229,229,0); transition: 1.0s ;}
/*12.メニュー透明度*/
.menu-wrapper-changecolor { background: rgb(229,229,229); transition: 1.0s ;}
/*13.メニュー下線色（マウスオン）*/
#menu > ul > li > a::after{	content: ''; width: 0;	transition: all 0.3s ease;	border-bottom: 2px solid #8aaaad;	display: block;}
#menu > ul > li > a:hover::after{ width: 100%; border-bottom: 2px solid #8aaaad;}
#menu > ul > li.cntmenu_over > a::after{ width: 100%; border-bottom: 2px solid #8aaaad;}
/*14.メニュー文字色*/
#menu > ul > li > a,#menu > ul > li > span { color : #000000;}
/*15.メニュー文字色（マウスオン）*/
#menu > ul > li > a:hover,#menu > ul > li > span:hover,#menu li.cntmenu_over > a { color: #8aaaad;}
/*17.サイドページ下線色*/
#sidebar a.sn_01, #sidebar a.sn_01_over,#sidebar a.sn_01_01, #sidebar a.sn_01_01_over { border-radius: 0em; border-bottom: 1px dashed #8aaaad;}
/*18.サイド親ページ文字色*/
#sidebar a.sn_01, #sidebar a.sn_01_over { color : #2e2e2e !important;}
/*19.サイド親ページ文字色（マウスオン）*/
#sidebar a.sn_01:hover, #sidebar a.sn_01_over{ color : #8aaaad !important;}
/*20.サイド子ページ文字色*/
#sidebar a.sn_01_01, #sidebar a.sn_01_01_over{ color : #2e2e2e !important;}
/*21.サイド子ページ文字色（マウスオン）*/
#sidebar a.sn_01_01:hover, #sidebar a.sn_01_01_over { color : #8aaaad !important;}
/*22.フッター背景色*/
body{ background : #8aaaad;/*footerと同色*/}
#footer{ background : #8aaaad;/*footerと同色*/}
/*23.スマホパネル背景色  local-480,local-670に記載 */
/*25.スマホ時メニュー背景色  local-480,local-670に記載 */
/*26.スマホ時メニュー親ページ文字色  local-480,local-670に記載 */
/*27.スマホ時メニュー子ページ文字色  local-480,local-670に記載 */
/*28.ページ全体リンク色*/
a {color:#0000ff;}
/*30.ページ全体リンク色（訪問後）*/
a:visited {color:#810081;}
/*29.ページ全体リンク色（マウスオーバー時）*/
a:hover {color:#0000ff;}

/*html body*/
body{
	display    : block !important;
	margin     : 0;
	padding    : 0;
	font-family: "メイリオ", Meiryo,Verdana, Helvetica, "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", sans-serif;
	animation: fadeIn 0.5s ease 0s 1 normal;
    -webkit-animation: fadeIn 0.5s ease 0s 1 normal;
		line-height: normal;

}

/* Header */
#header {
	background-size: cover;
  	min-height:100vh;
  	background-attachment: fixed;
  	}
#header_other {
  	background-size: cover;
  	background-attachment: fixed;
  	min-height:30vh;
  	}
#header .container,#header_other .container{
	overflow: auto;
	opacity:0;
}
/* Menu */
.menu-wrapper-topfix,
.menu-wrapper {
	display:flex;
	align-items: center;/*IE11*/
}
.menu-wrapper {
	top: 0;/*top or botoom*/
	left      : 0;
	width     : 100%;
  	}
.menu-wrapper-topfix {
	top       : 0;
	left      : 0;
	width     : 100%;
	position  : fixed;
	z-index   : 10;
}
#menu {
	margin-top: auto;
    margin-bottom: auto;
}
#menu > ul {
	margin        : 0;
	padding       : 0;
	text-align    : right;
	letter-spacing: -.40em; /* 文字間を詰めて隙間を削除する */
	line-height   : 1.5em;
}
#menu > ul > li {
	display     : inline-block;
}
#menu > ul > li:last-child {
	padding-right: 0;
	border-right : none;
}

#menu > ul > li > a,
#menu > ul > li > span {
	display        : inline-block;
	padding        : 2em 1em;
	letter-spacing : 0.06em;
	text-decoration: none;
	font-size      : 14px;
	outline        : 0;
}
#menu > ul > li > a:hover,
#menu > ul > li > span:hover,
#menu li.cntmenu_over > a {
}
#menu li.active a {
	color: #F00;
}
#menu > ul > li > ul {
	display: none;
}
.menu_left_box,
.menu_right_box {
	/*padding: 20px 20px;*/
	margin-top: auto;
    margin-bottom: auto;
}
/*.menu_left_box{
	min-width:400px;
}
.menu_right_box{
	min-width:200px;
}*/
	
/* Main */
#main
{
	position  : relative;
}
#main #mobile, #cnt_btmbt
{
	float:right;
	width:75px;
}
#main #mobile a, #cnt_btmbt a
{
	margin:0;
	padding:0;
	overflow:hidden;
	display:block;
	text-indent:-9999px;
	width:75px;
	height:24px;
	background:url(../img/mobile.gif) 0 0 no-repeat;
}
/* Sidebar */
#sidebar {
	padding-right: 10px;
}
.sidemenu {
	margin :0;
	padding:0 0 10px 0;
}
.sidemenu li{
	list-style:none;
	overflow  :hidden;
}
.sidemenu ul{
	margin :0;
	padding:0 0 10px 0;
}
#sidebar a.sn_01, #sidebar a.sn_01_over {
	position          : relative;
	display           : inline-block;
	padding           : 15px 35px;
	text-decoration   : none !important;
	font-size         : 14px;
	font-weight       : 300;
	border-radius     : 0.25em;
	width             : 100%;
	margin            : 10px;
	box-sizing        : border-box;
}
#sidebar a.sn_01_over{
	box-shadow: none;
}
#sidebar a.sn_01:hover{
	box-shadow: none;
	-moz-transition   : color 0.35s ease-in-out, background-color 0.35s ease-in-out;
	-webkit-transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out;
	-o-transition     : color 0.35s ease-in-out, background-color 0.35s ease-in-out;
	-ms-transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out;
	transition        : color 0.35s ease-in-out, background-color 0.35s ease-in-out;
}
#sidebar a.sn_01_01, #sidebar a.sn_01_01_over{
	position          : relative;
	display           : inline-block;
	padding           : 15px 45px;
	text-decoration   : none !important;
	font-size         : 14px;
	width             : 100%;
	margin            : 10px;
	box-sizing        : border-box;
}
#sidebar a.sn_01_01_over {
	box-shadow: none;
}
#sidebar a.sn_01_01:hover{
	box-shadow: none;
	-moz-transition   : color 0.35s ease-in-out, background-color 0.35s ease-in-out;
	-webkit-transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out;
	-o-transition     : color 0.35s ease-in-out, background-color 0.35s ease-in-out;
	-ms-transition    : color 0.35s ease-in-out, background-color 0.35s ease-in-out;
	transition        : color 0.35s ease-in-out, background-color 0.35s ease-in-out;
}

.sn_01_over::before,
.sn_01::before,
.sn_01_01_over::before,
.sn_01_01::before {
    left:10px;
    width: 5px;
    height: 5px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
    transition: all .2s;
}
.sn_01_over:hover::before,
.sn_01:hover::before,
.sn_01_01_over:hover::before,
.sn_01_01:hover::before {
    left: 15px;
}


/* Footer */
#footer {
	position  : relative;
}
#footer header h2 {
	color: #FFF !important;
}
#footer header .byline {
	color: rgba(255,255,255,.2);
}

/* Slide */
#photo {
	margin :1em auto 0 auto;
	padding:0 0 19px 0;
	width  :932px;
}
#photo #img{
	background-position:0 0;
	background-repeat  :repeat-x;
	height             :222px;
}

/* Form */
.submit_resp {
	-moz-border-radius   : 1em ;
	-webkit-border-radius: 1em;
	border-radius        : .3em ;
	font-size            : 16px;
	padding              : .6em 20px;
	min-width            : .75em;
	position             : relative;
	text-overflow        : ellipsis;
	overflow             : hidden;
	white-space          : nowrap;
	zoom                 : 1;
	border               : 1px solid #ccc;
	background           : #eee;
	font-weight          : bold;
	color                : #222 ;
	text-shadow          : 0 1px 0 #ffffff ;
	background-image     : -webkit-gradient(linear, left top, left bottom, from( #ffffff ), to( #f1f1f1 ));
	background-image     : -webkit-linear-gradient( #ffffff, #f1f1f1 );
	background-image     :    -moz-linear-gradient( #ffffff, #f1f1f1 );
	background-image     :     -ms-linear-gradient( #ffffff, #f1f1f1 );
	background-image     :      -o-linear-gradient( #ffffff, #f1f1f1 );
	background-image     :         linear-gradient( #ffffff, #f1f1f1 );
}
.submit_resp:hover {
	border          : 1px solid #bbb;
	background      : #dfdfdf;
	font-weight     : bold;
	color           : #222;
	text-shadow     : 0 1px 0 #ffffff ;
	background-image: -webkit-gradient(linear, left top, left bottom, from( #f6f6f6 ), to( #e0e0e0 )); 
	background-image: -webkit-linear-gradient( #f6f6f6, #e0e0e0); 
	background-image:    -moz-linear-gradient( #f6f6f6, #e0e0e0); 
	background-image:     -ms-linear-gradient( #f6f6f6, #e0e0e0); 
	background-image:      -o-linear-gradient( #f6f6f6, #e0e0e0); 
	background-image:         linear-gradient( #f6f6f6, #e0e0e0);
}
.submit_resp:active {
	-moz-box-shadow   : 0px 0px 12px #387bbe ;
	-webkit-box-shadow: 0px 0px 12px #387bbe ;
	box-shadow        : 0px 0px 12px #387bbe ;	
}
.text_resp {
	-moz-border-radius   : .6em ;
	-webkit-border-radius: .6em ;
	border-radius        : .2em ;
	border               : 1px solid #aaa;
	color                : #333333;
	text-shadow          : 0 1px 0 #fff ;
	background           : #f9f9f9 ;
	background-image     : -webkit-gradient(linear, left top, left bottom, from( #f9f9f9 ), to( #eeeeee ));
	background-image     : -webkit-linear-gradient( #f9f9f9 , #eeeeee );
	background-image     :    -moz-linear-gradient( #f9f9f9 , #eeeeee);
	background-image     :      -ms-linear-gradient( #f9f9f9, #eeeeee);
	background-image     :       -o-linear-gradient( #f9f9f9, #eeeeee);
	background-image     :          linear-gradient( #f9f9f9, #eeeeee);
	
	background-image: none;
	padding         : .4em;
	margin          : .5em;
	line-height     : 1.4;
	font-size       : 16px;
	width           : 90%;
	outline         : 0;
}
.text_resp:focus {
	-moz-box-shadow   : 0px 0px 12px #387bbe ;
	-webkit-box-shadow: 0px 0px 12px #387bbe ;
	box-shadow        : 0px 0px 12px #387bbe ;	
}
/* Cart */
#CartArea{
	width:100% !IMPORTANT;
	height:auto !IMPORTANT;
	overflow:auto !IMPORTANT;
}
#CartFrame{
	width:100% !IMPORTANT;
	height:2500px !IMPORTANT;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
/* Preview */
.preview_label {
    top: calc(100vh - 30px) !important;
}