@charset "utf-8";

/*==============================================================================
  
 【common.css】- 共通/テーマ別スタイルシート
  
  テーマに依存しないスタイルとファーストビューに必要なスタイルを記述しています。
  また、それぞれの項目ではスタイル上書きによる無駄な記述をさけるため、
  メディアクエリで完全にスタイルを分けて記述しています。

  <目次>
   # Reset CSS
   # Text
   # Link
   # Image
   # List
   # Table
   # From
   # Space
   # Other
   # General
   # Header
   # Main column
  
==============================================================================*/


/*--------------------------------------
  # Reset CSS
--------------------------------------*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video {margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent;}body {line-height:1;-webkit-text-size-adjust:100%;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;}nav ul {list-style:none;}blockquote,q {quotes:none;}blockquote:before,blockquote:after,q:before,q:after {content:'';content:none;}a {margin:0;padding:0;text-decoration:none;vertical-align:baseline;background:transparent;cursor:text;}/* change colours to suit your needs */ins {background-color:#ff9;color:#000;text-decoration:none;}/* change colours to suit your needs */mark {background-color:#ff9;color:#000; font-style:italic;font-weight:bold;}del {text-decoration: line-through;}abbr[title],dfn[title] {border-bottom:1px dotted;cursor:help;}table {border-collapse:collapse;border-spacing:0;}/* change border colour to suit your needs */hr {display:block;height:1px;border:0; border-top:1px solid #cccccc;margin:1.5em 0;padding:0;}input,select,button {-webkit-appearance: none;appearance: none;vertical-align:middle;}select::-ms-expand{display: none;}ul,ol,li {list-style-type: none;}input::-ms-clear {visibility:hidden}input::-ms-reveal {visibility:hidden}h1,h2,h3,h4,h5,h6 {font-weight: normal;}*{box-sizing: border-box;margin: 0;padding: 0;font-size: 100%;font-style: normal;border: none;outline: none;}

/*--------------------------------------
  # Text
--------------------------------------*/

p {  margin-bottom: 2rem;}

/* indent
--------------------*/
p.indent {  text-indent: -1em;  padding-left: 1em;}
p.indent2em {  text-indent: -2em;  padding-left: 2em;}
p.indent2-5em {  text-indent: -2.5em;  padding-left: 2.5em;}
p.indent3em {  text-indent: -3em;  padding-left: 3em;}
p.indent4em {  text-indent: -4em;  padding-left: 4em;}
p.indent5em {  text-indent: -5em;  padding-left: 5em;}
p.indent6em {  text-indent: -6em;  padding-left: 6em;}
p.indent7em {  text-indent: -7em;  padding-left: 7em;}
p.indent8em {  text-indent: -8em;  padding-left: 8em;}
p.indent9em {  text-indent: -9em;  padding-left: 9em;}
p.indent10em {  text-indent: -10em;  padding-left: 10em;}
p.indent11em {  text-indent: -11em;  padding-left: 11em;}
p.indent12em {  text-indent: -12em;  padding-left: 12em;}
strong { font-weight: 500;}
.strong { font-weight: 500;}
.marker {background:linear-gradient(transparent 60%, rgba(255,246,0,0.6) 60%);}
.error_message {margin:1em 0;color:#F00;}

/* align
--------------------*/
.alignright {  text-align: right;}
.alignleft {  text-align: left;}
.aligncenter {  text-align: center;}
.valigntop {  vertical-align: top;}
.valignmiddle {  vertical-align: middle;}
.valignbottom {  vertical-align: bottom;}
.flexcenter { display: flex;align-items: center;}
@media screen and (max-width:949px) {
.sp-alignright { text-align: right !important;}
.sp-alignleft { text-align: left !important;}
.sp-aligncenter { text-align: center !important;}
.flexcenter { flex-wrap: wrap;justify-content: center;}
}

/* size
--------------------*/
.fs-small {  font-size: 80% !important;}
.fs-large {  font-size: 112% !important;}
.fs-big {  font-size: 125% !important;}
.fs-bigger {  font-size: 138% !important;}

/* color
--------------------*/
.fc-black {  color: #000;}
.fc-red {  color: #d70c18;}
.fc-orange {  color: #F60;}
.fc-blue {  color: #00afcc;}
.fc-green {  color: #0F0;}
.fc-gray {  color: #999;}
.fc-pink {  color: #f64077;}
.fc-brown {  color: #4f3521;}

/*--------------------------------------
  # Link
--------------------------------------*/

a:not(.call-link),
body.m .call-link {
  text-decoration: underline;
  cursor: pointer;
}
body.dv a:hover {
  text-decoration: none;
}

/*--------------------------------------
  # Image
--------------------------------------*/

img {
  max-width: 100%;
  height: auto;
}
img.alignright,div.alignright {
  float: right;
  clear: right;
  margin: 0 0 20px 20px;
}
img.alignleft,div.alignleft {
  float: left;
  clear: left;
  margin: 0 20px 20px 0;
}
div.alignright img {
  margin-left: 10px;
}
div.alignleft img {
  margin-right: 10px;
}
img.aligncenter {
  display: block;
  margin: 0 auto;
}

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

img.alignright,div.alignright {
  width: 40%;
  margin: 0 0 10px 10px;
}
img.alignleft,div.alignleft {
  width: 40%;
  margin: 0 10px 10px 0;
}
img.aligncenter, img.img-fit {
  float: none;
  display: block;
  width: 100%;
  margin: 0 auto;
}
div.alignright img,div.alignleft img {
  display: block;
  margin: 0 0 10px;
}

}

/*--------------------------------------
  # List
--------------------------------------*/

ul.list-mark,ol.list-mark {
  margin-bottom: 1.5em;
}
ul.list-mark > li {
  position: relative;
  padding-left: 1em;
}
ul.list-mark > li:not(:last-child),ol.list-mark > li:not(:last-child) {
  margin-bottom: 0.5em;
}
ul.list-mark > li:before {
  content: '';
  position: absolute;
  top: 0.8em;
  left: 0.3em;
  width: 6px;
  height: 6px;
  margin: -1px 0 0 -1px;
  background: #2b2b2b;
  border-radius: 100%;
}
ol.list-mark > li {
  list-style: decimal;
  margin-left: 1.5em;
}

/*--------------------------------------
  # Table
--------------------------------------*/
table {
  width: 100%;
  margin-bottom: 2em;
  word-break: break-all;
}
table caption {
	color: #0b6bde;
	margin-bottom: 5px;
	font-size: 1.8rem;
	font-weight: 500;
	text-align: left;
	letter-spacing: 1px;
}
table:not(.layout) {
	background: #FFF;
  border-top: 1px solid #c8c8c8;
  border-left: 1px solid #c8c8c8;
}
table:not(.layout) th,table:not(.layout) td {
	padding: 12px;
  border-bottom: 1px solid #c8c8c8;
  border-right: 1px solid #c8c8c8;
}
table:not(.layout) th {
	background: #e5e5e5;
	font-size: 1.4rem;
	font-weight: 700;
}

@media screen and (min-width:950px) {
table.widthauto {
  width: auto;
	min-width: 50%;
}
table th.nowrap,table td.nowrap {
  white-space: nowrap;
}
}
@media screen and (max-width:949px) {
table {
	font-size: 1.5rem;
}
div.adjust-table-sp {
  width: 100%;
  margin-bottom: 15px;
  overflow-x: scroll;
}
div.adjust-table-sp::-webkit-scrollbar {
  width: 4px;
}
div.adjust-table-sp::-webkit-scrollbar:horizontal {
  height: 4px;
}
div.adjust-table-sp::-webkit-scrollbar-thumb {
  background: #999;
  border-radius: 10px;
}
div.adjust-table-sp::-webkit-scrollbar-thumb:horizontal {
  background: #999;
  border-radius: 10px;
}
div.adjust-table-sp table {
  width: 790px;
}
table.sp-style th,table.sp-style td {
  display: block;
  width: 100% !important;
}
table.sp-style th {
	padding: 6px 15px;
}
/*table.sp-style:not(.layout) {
	margin: 0 0 15px;
	border-collapse: collapse;
	border-spacing: 0;
	border-top: 1px solid #d8e2e5;
	border-left: 1px solid #d8e2e5;
}
table.sp-style:not(.layout) th,table.sp-style:not(.layout) td {
  padding: 8px 13px 13px;
	border-right: 1px solid #d8e2e5;
}
table.sp-style:not(.layout) th {
	padding: 6px 8px;
	background: #f3f7f8;
  border-bottom: none;
}*/
}

/*--------------------------------------
  # Form
--------------------------------------*/
form input:not([type="radio"]):not([type="checkbox"])):not([type="submit"]):not([type="button"]),form select,form textarea {
  display: inline-block;
  padding: 8px;
  font-family: 'Noto Sans JP', sans-serif;
  border: 1px solid #000;
  border-radius: 3px;
  vertical-align: top;
}
form select {
	position:relative;
	padding-right:30px !important;
	background:url('data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20id%3D%22%26%23x30EC%3B%26%23x30A4%3B%26%23x30E4%3B%26%23x30FC%3B_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2220px%22%20height%3D%2220px%22%20viewBox%3D%220%200%2020%2020%22%20style%3D%22enable-background%3Anew%200%200%2020%2020%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpolygon%20style%3D%22fill%3A%23333333%3B%22%20points%3D%2214.5%2C7%2010%2C14.793%205.5%2C7%20%22%2F%3E%3C%2Fsvg%3E') right 4px center no-repeat #FFF !important;
}
form select::-ms-expand{display:none}
form textarea {
  display: block;
  width: 98%;
  min-width: 98%;
  max-width: 98%;
  min-height: 100px;
}
form input[type="radio"],form input[type="checkbox"] {
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-right: 5px;
  background: #FFF;
  border: 1px solid #CCC;
  vertical-align: baseline;
}
form input[type="radio"] {
  position: relative;
  border-radius: 100px;
}
form input[type="radio"]:checked {
}
form input[type="radio"]:checked:after{
  content: "";
  display: block;
  position: absolute;
  top: 2px;
  left: 2px;
  width: 9px;
  height: 9px;
  background: #000;
  border-radius: 100px;
}
form input[type="checkbox"] {
  position:relative;
  border-radius: 3px;
}
form input[type="checkbox"]:checked {
}
form input[type="checkbox"]:checked:after{
  content: "";
  display: block;
  position: absolute;
  top: -2px;
  left: 3px;
  width: 5px;
  height: 10px;
  transform: rotate(40deg);
  border-bottom: 3px solid #000;
  border-right: 3px solid #000;
}
form input[type="submit"],form input[type="button"],button,.send.settlement_form_send input[type="button"] {
  display: inline-block;
  margin: 0 1% 1%;
  padding: 8px 20px;
  background: #333;
	color: #FFF;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 1.5rem;
	font-weight: 500;
	border-bottom: 3px solid rgba(0,0,0,0.2);
  border-radius: 3px;
  vertical-align: top;
  cursor: pointer;
	transition: 0.2s;
}
body.dv form input[type="submit"]:hover,body.dv form input[type="button"]:hover,body.dv button:hover,body.dv .send.settlement_form_send input[type="button"]:hover {
	border-bottom: 3px solid rgba(0,0,0,0);
	transform: translateY(2px);
	opacity: 0.8;
}
input[type="text"],input[type="email"],input[type="tel"],input[type="number"],input[type="url"],select,textarea,input[type="password"] {
	display: inline-block;
	width: 98%;
	min-height: 38px;
	margin: 1%;
	padding: 6px;
	background: #FFF;
	font-size: 16px;
	font-family: 'Noto Sans JP', sans-serif;
	border: 1px solid #CCC;
	border-radius: 3px;
	outline: none;
	vertical-align: middle;
}
@media all and (min-width:950px) {
input[type="text"],input[type="email"],input[type="tel"],select,textarea,input[type="password"] {
}
select {width: auto;}
}
/*--------------------------------------
  # Space
--------------------------------------*/

.mt0{margin-top:0px!important;}.mt5{margin-top:5px!important;}.mt10{margin-top:10px!important;}.mt15{margin-top:15px!important;}.mt20{margin-top:20px!important;}.mt25{margin-top:25px!important;}.mt30{margin-top:30px!important;}.mt35{margin-top:35px!important;}.mt40{margin-top:40px!important;}.mt45{margin-top:45px!important;}.mt50{margin-top:50px!important;}.mt55{margin-top:55px!important;}.mt60{margin-top:60px!important;}.mt65{margin-top:65px!important;}.mt70{margin-top:70px!important;}.mt75{margin-top:75px!important;}.mt80{margin-top:80px!important;}.mt85{margin-top:85px!important;}.mt90{margin-top:90px!important;}.mt95{margin-top:95px!important;}.mt100{margin-top:100px!important;}.mr0{margin-right:0px!important;}.mr5{margin-right:5px!important;}.mr10{margin-right:10px!important;}.mr15{margin-right:15px!important;}.mr20{margin-right:20px!important;}.mr25{margin-right:25px!important;}.mr30{margin-right:30px!important;}.mr35{margin-right:35px!important;}.mr40{margin-right:40px!important;}.mr45{margin-right:45px!important;}.mr50{margin-right:50px!important;}.mr55{margin-right:55px!important;}.mr60{margin-right:60px!important;}.mr65{margin-right:65px!important;}.mr70{margin-right:70px!important;}.mr75{margin-right:75px!important;}.mr80{margin-right:80px!important;}.mr85{margin-right:85px!important;}.mr90{margin-right:90px!important;}.mr95{margin-right:95px!important;}.mr100{margin-right:100px!important;}.mb0{margin-bottom:0px!important;}.mb5{margin-bottom:5px!important;}.mb10{margin-bottom:10px!important;}.mb15{margin-bottom:15px!important;}.mb20{margin-bottom:20px!important;}.mb25{margin-bottom:25px!important;}.mb30{margin-bottom:30px!important;}.mb35{margin-bottom:35px!important;}.mb40{margin-bottom:40px!important;}.mb45{margin-bottom:45px!important;}.mb50{margin-bottom:50px!important;}.mb55{margin-bottom:55px!important;}.mb60{margin-bottom:60px!important;}.mb65{margin-bottom:65px!important;}.mb70{margin-bottom:70px!important;}.mb75{margin-bottom:75px!important;}.mb80{margin-bottom:80px!important;}.mb85{margin-bottom:85px!important;}.mb90{margin-bottom:90px!important;}.mb95{margin-bottom:95px!important;}.mb100{margin-bottom:100px!important;}.ml0{margin-left:0px!important;}.ml5{margin-left:5px!important;}.ml10{margin-left:10px!important;}.ml15{margin-left:15px!important;}.ml20{margin-left:20px!important;}.ml25{margin-left:25px!important;}.ml30{margin-left:30px!important;}.ml35{margin-left:35px!important;}.ml40{margin-left:40px!important;}.ml45{margin-left:45px!important;}.ml50{margin-left:50px!important;}.ml55{margin-left:55px!important;}.ml60{margin-left:60px!important;}.ml65{margin-left:65px!important;}.ml70{margin-left:70px!important;}.ml75{margin-left:75px!important;}.ml80{margin-left:80px!important;}.ml85{margin-left:85px!important;}.ml90{margin-left:90px!important;}.ml95{margin-left:95px!important;}.ml100{margin-left:100px!important;}.pt0{padding-top:0px!important;}.pt5{padding-top:5px!important;}.pt10{padding-top:10px!important;}.pt15{padding-top:15px!important;}.pt20{padding-top:20px!important;}.pt25{padding-top:25px!important;}.pt30{padding-top:30px!important;}.pt35{padding-top:35px!important;}.pt40{padding-top:40px!important;}.pt45{padding-top:45px!important;}.pt50{padding-top:50px!important;}.pt55{padding-top:55px!important;}.pt60{padding-top:60px!important;}.pt65{padding-top:65px!important;}.pt70{padding-top:70px!important;}.pt75{padding-top:75px!important;}.pt80{padding-top:80px!important;}.pt85{padding-top:85px!important;}.pt90{padding-top:90px!important;}.pt95{padding-top:95px!important;}.pt100{padding-top:100px!important;}.pr0{padding-right:0px!important;}.pr5{padding-right:5px!important;}.pr10{padding-right:10px!important;}.pr15{padding-right:15px!important;}.pr20{padding-right:20px!important;}.pr25{padding-right:25px!important;}.pr30{padding-right:30px!important;}.pr35{padding-right:35px!important;}.pr40{padding-right:40px!important;}.pr45{padding-right:45px!important;}.pr50{padding-right:50px!important;}.pr55{padding-right:55px!important;}.pr60{padding-right:60px!important;}.pr65{padding-right:65px!important;}.pr70{padding-right:70px!important;}.pr75{padding-right:75px!important;}.pr80{padding-right:80px!important;}.pr85{padding-right:85px!important;}.pr90{padding-right:90px!important;}.pr95{padding-right:95px!important;}.pr100{padding-right:100px!important;}.pb0{padding-bottom:0px!important;}.pb5{padding-bottom:5px!important;}.pb10{padding-bottom:10px!important;}.pb15{padding-bottom:15px!important;}.pb20{padding-bottom:20px!important;}.pb25{padding-bottom:25px!important;}.pb30{padding-bottom:30px!important;}.pb35{padding-bottom:35px!important;}.pb40{padding-bottom:40px!important;}.pb45{padding-bottom:45px!important;}.pb50{padding-bottom:50px!important;}.pb55{padding-bottom:55px!important;}.pb60{padding-bottom:60px!important;}.pb65{padding-bottom:65px!important;}.pb70{padding-bottom:70px!important;}.pb75{padding-bottom:75px!important;}.pb80{padding-bottom:80px!important;}.pb85{padding-bottom:85px!important;}.pb90{padding-bottom:90px!important;}.pb95{padding-bottom:95px!important;}.pb100{padding-bottom:100px!important;}.pl0{padding-left:0px!important;}.pl5{padding-left:5px!important;}.pl10{padding-left:10px!important;}.pl15{padding-left:15px!important;}.pl20{padding-left:20px!important;}.pl25{padding-left:25px!important;}.pl30{padding-left:30px!important;}.pl35{padding-left:35px!important;}.pl40{padding-left:40px!important;}.pl45{padding-left:45px!important;}.pl50{padding-left:50px!important;}.pl55{padding-left:55px!important;}.pl60{padding-left:60px!important;}.pl65{padding-left:65px!important;}.pl70{padding-left:70px!important;}.pl75{padding-left:75px!important;}.pl80{padding-left:80px!important;}.pl85{padding-left:85px!important;}.pl90{padding-left:90px!important;}.pl95{padding-left:95px!important;}.pl100{padding-left:100px!important;}


/*--------------------------------------
  # Other
--------------------------------------*/

.clear {clear: both;}
iframe {display: block;}
@media screen and (min-width:950px) {
.hide-d {  display: none !important;}
}
@media screen and (max-width:949px) {
.hide-m {  display: none !important;}
}

/*--------------------------------------
  # General
--------------------------------------*/

html {
  font-size: 62.5%;
  overflow-y: scroll;
  word-break: break-all;
  line-break:strict;
}
@-moz-document url-prefix() { /* FireFox */
  html {
    word-break: normal;
    word-wrap: break-word;
  }
}
@media screen and (-webkit-min-device-pixel-ratio: 0) { /* safari */
  _::-webkit-full-page-media, _:future, :root #container {
    word-break: normal !important;
    word-wrap: break-word !important;
  }
}
body {
	margin: 0;
	background: #f9f9f9;
  color: #000;
  font-size: 1.6rem;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  line-height: 1.8;
  text-align: left;
  counter-reset: number;
}

@media screen and (max-width:949px) {
html { font-size: 55%;}
body {position: relative; left:0; transition: 0.5s;}
body.open {left: -80%;}
}
/*--------------------------------------
  # Header
--------------------------------------*/
@media print, screen and (min-width:950px) {
header#header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	clear: both;
	z-index: 1000;
}
header#header div.header-wrapper {
	display: flex;
	justify-content: space-between;
  align-items: center;
	clear: both;
	padding: 0 0 0 60px;
	color: #FFF;
}
header#header div.site-title a {
	display: block;
	margin: 0 0 0 -1px;
	padding: 10px 0 13px;
	color: #FFF;
	font-size: 1.6rem;
	font-weight: 500;
	text-decoration: none;
	letter-spacing: 1px;
	line-height: 1.4;
  transition: 0.2s;
}
header#header div.site-title a .sub {
	display: inline-block;
	margin: 0 0 0 1rem;
	padding: 3px 5px 2px;
	font-size: 1.1rem;
	font-weight: 400;
	letter-spacing: 0;
	line-height: 1.2;
	border: 1px solid rgba(255,255,255,0.6);
	border-radius: 3px;
	vertical-align: middle;
}
header#header div#global-nav-icon {
  display: none;
}
header#header nav#global-nav {
	margin-left: 30px;
}
header#header nav#global-nav .global-nav-wrapper {
	display: flex;
  align-items: center;
}
header#header nav#global-nav .welcome {
	margin-right: 30px;
	font-size: 1.4rem;
}
header#header nav#global-nav ul {
	display: flex;
}
header#header nav#global-nav ul li {
	border-left: 1px solid rgba(255,255,255,0.4);
}
header#header nav#global-nav ul li a {
  position: relative;
  display: block;
	padding: 10px 15px 5px;
	color: #FFF;
	font-size: 1.2rem;
  text-decoration: none;
  transition: 0.2s;
}
header#header nav#global-nav ul li.cart a {
	background: rgba(255,255,255,0.1);
}
header#header nav#global-nav ul li.logout a {
	background: rgba(0,0,0,0.2);
}
header#header nav#global-nav ul li a:before {
	content: '';
	display: block;
	width: 20px;
	height: 20px;
	margin: 0 auto;
	font-family: "Font Awesome 6 Free";
	font-size: 1.4rem;
	font-weight: 900;
	text-align: center;
	line-height: 20px;
}
header#header nav#global-nav ul li.login a:before {
	content: '\f084';
}
header#header nav#global-nav ul li.mypage a:before {
	content: '\f007';
}
header#header nav#global-nav ul li.cart a:before {
	content: '\f07a';
}
header#header nav#global-nav ul li.favorite a:before {
	content: '\f004';
}
header#header nav#global-nav ul li.mail a:before {
	content: '\f0e0';
}
header#header nav#global-nav ul li.logout a:before {
	content: '\f2f5';
}
header#header div.site-title a:hover,
header#header nav#global-nav ul li a:hover {
  opacity: 0.7;
}
}
@media screen and (max-width:949px) {
header#header div.site-title {
	display: flex;
	flex-direction: column;
	justify-content: center;
  width: 100%;
	height: 60px;
  padding: 0 70px 0 10px;
}
header#header div.site-title a {
	display: block;
	color: #FFF;
	font-size: 1.8rem;
	font-weight: 500;
	text-decoration: none;
	line-height: 1.4;
}
header#header div.site-title a .sub {
	display: inline-block;
	margin: 0 0 0 1rem;
	padding: 3px 5px 2px;
	font-size: 1.2rem;
	font-weight: 400;
	line-height: 1.2;
	border: 1px solid rgba(255,255,255,0.6);
	border-radius: 3px;
	vertical-align: middle;
}
header#header div#global-nav-icon {
  position: fixed;
  top: 0;
  right: 0;
  cursor: pointer;
	transition: 0.5s;
  z-index: 1000;
}
header#header div#global-nav-icon.open {
  position: fixed;
  bottom: 0;
	right: 80%;
  padding-left: 20%;
  background: none;
}
header#header div#global-nav-icon div.nav-icon {
  position: relative;
  width: 60px;
  height: 60px;
  transition: 0.25s;
}
header#header div#global-nav-icon div.nav-icon div.line1,
header#header div#global-nav-icon div.nav-icon div.line2,
header#header div#global-nav-icon div.nav-icon div.line3 {
  position: absolute;
  left: 16px;
  width: 28px;
  height: 1px;
  background: #fff;
  border-radius: 2px;
  transition: 0.25s;
}
header#header div#global-nav-icon div.nav-icon div.line1 {
  top: 13px;
}
header#header div#global-nav-icon div.nav-icon div.line2 {
  width: 18px;
  top: 23px;
}
header#header div#global-nav-icon div.nav-icon div.line3 {
  top: 33px;
}
header#header div#global-nav-icon div.nav-icon div.text {
	position: absolute;
	top: 38px;
	left: 0;
	width: 100%;
	color: #FFF;
	font-family: 'Jost', sans-serif;
	font-size: 1.1rem;
	text-align: center;
}
header#header div#global-nav-icon.open div.nav-icon div.line1 {
  top: 23px;
  background: #FFF;
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}
header#header div#global-nav-icon.open div.nav-icon div.line2 {
  left: 50%;
  width: 0;
}
header#header div#global-nav-icon.open div.nav-icon div.line3 {
  top: 23px;
  background: #FFF;
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}
#header #global-nav {
	position: fixed;
	top: 0;
	left: 100%;
	width: 80%;
	height: 100%;
	padding-bottom: 150px;
	background: #000;
	color: #FFF;
	overflow: auto;
	transition: 0.5s;
}
body.open #header #global-nav {
  left: 20%;
}
header#header nav#global-nav .welcome {
	padding: 30px 15px;
	font-size: 1.8rem;
	font-weight: 500;
	text-align: center;
  border-bottom: 1px solid rgba(255,255,255,0.4);
}
header#header nav#global-nav ul {
  width: 100%;
}
header#header nav#global-nav ul li:not(.sub) {
  margin: 0;
  border-bottom: 1px solid rgba(255,255,255,0.4);
}
header#header nav#global-nav ul li:not(.sub) a {
  position: relative;
  display: block;
  padding: 15px 30px 15px 50px;
  color: #FFF;
  font-size: 1.6rem;
  font-weight: 400;
  text-decoration: none;
  line-height: 1.4;
  cursor: pointer;
}
header#header nav#global-nav ul li.cart a {
	background: rgba(255,255,255,0.1);
}
header#header nav#global-nav ul li.logout a {
	background: rgba(0,0,0,0.2);
}
header#header nav#global-nav ul li:not(.sub) a:after {
  content: '';
  position: absolute;
  top: 50%;
  right: 14px;
  display: block;
  width: 6px;
  height: 6px;
  margin: -5px 0 0;
  border-top: 1px solid #FFF;
  border-right: 1px solid #FFF;
  transform: rotate(45deg);
  transition: 0.15s;
}
header#header nav#global-nav ul li:not(.sub) a:before {
	content: '';
	position: absolute;
	top: 50%;
	left: 20px;
	width: 16px;
	height: 16px;
	font-family: "Font Awesome 6 Free";
	font-size: 1.4rem;
	font-weight: 900;
	text-align: center;
	line-height: 16px;
	transform: translate(0, -50%);
}
header#header nav#global-nav ul li.login a:before {
	content: '\f084';
}
header#header nav#global-nav ul li.mypage a:before {
	content: '\f007';
}
header#header nav#global-nav ul li.cart a:before {
	content: '\f07a';
}
header#header nav#global-nav ul li.home a:before {
	content: '\f015';
}
header#header nav#global-nav ul li.favorite a:before {
	content: '\f004';
}
header#header nav#global-nav ul li.mail a:before {
	content: '\f0e0';
}
header#header nav#global-nav ul li.privacy a:before {
	content: '\f023';
}
header#header nav#global-nav ul li.logout a:before {
	content: '\f2f5';
}
header#header nav#global-nav ul li.sub {
  margin: 0;
}
header#header nav#global-nav ul li.sub a {
  position: relative;
  display: block;
  padding: 10px 10px 10px 40px;
  color: #FFF;
  font-size: 1.4rem;
  font-weight: 400;
  text-decoration: none;
  line-height: 1.4;
  cursor: pointer;
}
header#header nav#global-nav ul li.sub a:after {
  content: '';
  position: absolute;
  top: 50%;
	left: 23px;
	width: 0;
	height: 0;
	margin: -4px 0 0;
	border-style: solid;
	border-width: 4px 0 4px 6px;
	border-color: transparent transparent transparent #FFF;
}
}
@media screen and (max-width:480px) {
header#header div.site-title a {
	font-size: 3.4vw;
}
}
/*--------------------------------------
  # Main column
--------------------------------------*/

@media print, screen and (min-width:950px) {

/* main
--------------------*/
div#main {
  clear: both;
	padding: 0 60px 60px;
}
/*.two-column div#main {
	margin-left: 240px;
}*/
div#main div.main-wrapper {
  clear: both;
  max-width: 1080px;
  margin: 0 auto;
	overflow: hidden;
}

/* breadcrumbs
--------------------*/
nav#breadcrumbs {
  clear: both;
  padding: 10px 60px 8px 60px;
  font-size: 1.4rem;
  letter-spacing: -.40em;
  line-height: 1.2;
	background: rgba(0,0,0,0.05);
}
nav#breadcrumbs li {
  display: inline-block;
  letter-spacing: normal;
  vertical-align: top;
}
nav#breadcrumbs li a,
nav#breadcrumbs li > span {
  position: relative;
  display: block;
  padding: 0 0 0 30px;
}
nav#breadcrumbs li a:before,
nav#breadcrumbs li > span:before {
  content: '';
  position: absolute;
  top: 48%;
  left: 10px;
	width: 6px;
	height: 6px;
	border-top: 1px solid #666;
	border-right: 1px solid #666;
	transform: rotate(45deg) translate(0, -50%);
}
nav#breadcrumbs li:first-child a {
  padding: 0 0 0 1.5em;
}
nav#breadcrumbs li:first-child a:before {
	content: '\f015';
  top: 0;
  left: 0;
	width: 6px;
	height: 6px;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	border:none;
	transform: rotate(0deg) translate(0, 0);
}

/* node
--------------------*/
div#container section.node {
  clear: both;
	margin: 0 0 30px;
  overflow: hidden;
}
div#container section.node.bg {
	padding: 20px;
	background: #FFF;
	border: 1px solid rgba(0,0,0,0.1);
}
div#container section.node div.node-wrapper {
  clear: both;
  padding: 0 20px;
  overflow: hidden;
}
div#container section.node.wide div.node-wrapper {
	position: relative;
  max-width: 1080px;
  margin: 0 auto;
}
div#container section.node div.node-flex-wrapper {
	display: flex;
	justify-content: space-between;
}
div#container section.node div.node-flex-inner {
	position: relative;
	width: 49%;
}
div#container div.node-inner {
  padding: 0 15px;
  overflow: hidden;
}

/* title
--------------------*/
div#main h1 {
  position: relative;
  clear: both;
  margin: 30px 0 20px -4px;
	color: #323232;
	font-size: 2.2rem;
	font-weight: 500;
	text-align: center;
	letter-spacing: 4px;
}
div#main h2 {
  position: relative;
  clear: both;
  margin: 40px 0 40px -1px;
	color: #323232;
	font-size: 3.0rem;
	font-weight: 500;
	letter-spacing: 1px;
}
div#main h3 {
  position: relative;
  clear: both;
	height: auto;
  margin: 0 0 20px;
	padding: 0 0 5px;
	background: none;
	color: #323232;
	font-size: 1.8rem;
	font-weight: 500;
	text-indent: 0;
	line-height: 1.8;
	border-bottom: 1px solid #323232;
}
div#main h4 {
  display: block;
  margin: 0 0 15px;
  color: #323232;
  font-size: 1.6rem;
  font-weight: 700;
}
div#main h5 {
	display: inline-block;
	margin: 0 0 10px;
	background: #898989;
	font-weight: 500;
}
}
@media screen and (max-width:949px) {

div#main {
  clear: both;
	margin: 0 0 40px;
	overflow: hidden;
}
div#main div.main-wrapper {
  clear: both;
	padding: 0 20px;
  overflow: hidden;
}
nav#breadcrumbs {
  display: none;
}

/* node
--------------------*/
div#container section.node {
  clear: both;
	margin: 0 0 20px;
  overflow: hidden;
}
div#container section.node div.node-wrapper {
  clear: both;
  overflow: hidden;
}
div#container section.node div.node-wrapper-odd {
	padding-bottom: 40px;
}
div#container section.node.bg {
	padding: 10px 15px;
	background: #FFF;
	border: 1px solid rgba(0,0,0,0.1);
}
div#container section.node div.node-flex-inner {
	margin-bottom: 30px;
}

/* title
--------------------*/
div#main h1 {
  position: relative;
  clear: both;
  margin: 30px 0 20px -2px;
	color: #323232;
	font-size: 2.2rem;
	font-weight: 500;
	text-align: center;
	letter-spacing: 2px;
}
div#main h2 {
  position: relative;
  clear: both;
  margin: 30px 0 30px -1px;
	color: #323232;
	font-size: 2.4rem;
	font-weight: 500;
	text-align: center;
	line-height: 1.4;
	letter-spacing: 1px;
}
div#main h2.detail-title {
	text-align: left;
}
div#main h3 {
  position: relative;
  clear: both;
	height: auto;
  margin: 0 0 20px;
	padding: 0 0 5px;
	background: none;
	color: #323232;
	font-size: 1.8rem;
	font-weight: 500;
	text-indent: 0;
	line-height: 1.8;
	border-bottom: 1px solid #323232;
}
div#main h4 {
  display: block;
  margin: 0 0 15px;
  color: #323232;
  font-size: 1.6rem;
  font-weight: 700;
}
/*div#main h4 {
  position: relative;
  clear: both;
  display: block;
  margin: 0 0 15px;
	padding: 0 0 3px;
  color: #2b2f39;
  font-size: 2.0rem;
  font-weight: 500;
  letter-spacing: 1px;
	border-bottom: 1px solid #d8e2e5;
}
div#main h4:before {
	content: '';
	position: absolute;
	bottom: -1px;
	left: 0;
	width: 30%;
	height: 1px;
	background: #00afcc;
}*/
div#main h5 {
	display: inline-block;
	margin: 0 0 10px;
	background: #898989;
	font-weight: 500;
}
}