@charset "utf-8";

/************************************************
 frt --pc 
************************************************ */

.frt {
  display: block;
  margin: 0 auto 64px;
  width: 100%;
  box-sizing: border-box;
  padding: 80px 0 0;
  /*　各種レギュレーションの値 */
  /* ***スペーシングレギュレーション*** */
  --spc-h1: 48px; /*・h1見出し下余白 */
  --spc-h2: 24px; /*・h2見出し下余白 */
  --spc-h3: 24px; /*・h3見出し下余白 */
  --spc-h4: 24px; /*・h4見出し下余白 */
  --spc-sect: 80px; /*・各セクション間の余白 */
  --spc-sect-in: 48px;/*・セクション内の余白 */
  --spc-content: 36px;/*・コンテンツ内の余白 */
  --spc-footer: 128px;/*・コンテンツとフッターとの間 */
  --spc-titlenext: 48px;/*・見出し+コンテンツ間 */

  /* ***タイポレギュレーション*** */
  --typ-h1: 48px; /*・h1見出 */
  --typ-h2: 36px;/*・h2見出し */
  --typ-h3: 24px;/*・h3見出し */
  --typ-h4: 20px;/*・h4見出し */
  --typ-text: 16px;/*・本文 */
  
  /* ***コンテナレギュレーション*** */
  --con-large: 1280px;/* ・コンテナ大 1280px */
  --con-mid: 1024px;/* ・コンテナ中 1024px */
  --con-small: 768px;/* ・コンテナ小 768px */


}
.pagetitle--image {
  background-color: #F2F2F2;
  -webkit-background-size: cover;
  background-size: cover;
  text-align: center;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -ms-align-items: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: center;
}
.pagetitle--image .pagetitle__box {
  box-sizing: border-box;
  padding: 80px 0;
  color: var(--accent-color);  
}
.pagetitle--image .pagetitle__catch {
  font-size: 14px;
}
.pagetitle--image .pagetitle__text {
  font-size: 48px;
}
.pagetitle--image .pagetitle__caption p {
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  margin: 40px auto 0;
}

#main_column .frt p {
  font-size: var(--typ-text);
  line-height: 1.75em;
}
img {
  max-width: 100%;
  height: auto;
  width: auto;
  vertical-align: bottom;
}
#main_column .frt h1.frt__title {
  text-align: center;
  margin-bottom: var(--spc-h1);
  color:var(--accent-color);
}
#main_column .frt h1.frt__title:after {
  content: attr(data-spell);
  display: block;
  margin: 0 auto;
  font-size: 48px;
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;  
}
#main_column .frt h2.frt__title ,
#main_column .frt .frt__title--h2 {
  text-align: center;
  margin-bottom: var(--spc-h2);
  color:var(--accent-color);
  font-size: var(--typ-h2);
  font-weight: bold;
  border: none;
  padding: 0;
  line-height: 1.5em;
}
#main_column .frt h3.frt__title ,
#main_column .frt .frt__title--h3 {
  text-align: center;
  margin-bottom: var(--spc-h3);
  color:var(--accent-color);
  font-size: var(--typ-h3);
  line-height: 1.5em;
  font-weight: bold;
  border: none;
  padding: 0;
}
#main_column .frt h4.frt__title ,
#main_column .frt .frt__title--h4 {
  text-align: center;
  margin-bottom: var(--spc-h4);
  color:var(--accent-color);
  font-size: var(--typ-h4);
  font-weight: bold;
  line-height: 1.5em;
  border: none;
  padding: 0;
}

#main_column .frt .frt__title .frt__title--caption {
  display: block;
  font-size: 16px;
  margin: 0 auto;
}
#main_column .frt .frt__caption {
  
}
#main_column .frt .container--large {
  width: 100%;
  max-width: var(--con-large);
  display: block;
  margin: var(--spc-sect) auto;
}
#main_column .frt .container--middle {
  width: 100%;
  max-width: var(--con-mid);
  display: block;
  margin: var(--spc-sect) auto;
}
#main_column .frt .container--small {
  width: 100%;
  max-width: var(--con-small);
  display: block;
  margin: var(--spc-sect) auto;
}
#main_column .frt .container--gray {
  width: 100%;
  max-width: var(--con-small);
  display: block;
  margin: var(--spc-sect) auto;
  background: #fafaf9;
  border: 1px solid #e7e5e4;
  box-sizing: border-box;
  display: block;
  padding: 30px;
}
#main_column div[class^="container--"] .box {
  margin: var(--spc-sect-in) auto;
}
#main_column .frt__box--imageright {
  margin: 0 auto;
  padding: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -ms-align-items: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-flex-direction: row-reverse;
  -moz-flex-direction: row-reverse;
  -ms-flex-direction: row-reverse;
  -o-flex-direction: row-reverse;
  flex-direction: row-reverse;
}
#main_column .frt__box--imageleft {
  margin: 0 auto;
  padding: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -ms-align-items: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
}
#main_column .frt__boximage {
  width: calc(558 / 1024 * 100%);
  max-width: 558px;
  margin: 0;
}
#main_column .frt__boxtext {
  width: calc(386 / 1024 * 100%);
  max-width: 386px;
  margin: 0;
}
#main_column .frt__boxtext *:last-child {
  margin-bottom: 0;
}
#main_column .frt .frt__boxtext h2,
#main_column .frt .frt__boxtext h3,
#main_column .frt .frt__boxtext h4 {
  text-align: left;
}

#main_column .frt__button {
  display: block;
  margin: var(--spc-content) auto;
}

#main_column .frt > *:first-child {
  margin-top: 0;
}
#main_column .frt > *:last-child {
  margin-bottom: 0!important;
}

/* button */
#main_column .button--bk {
  background-color: var(--accent-color);
  -webkit-background-size: auto 0.9em;
  background-size: auto 0.9em;
  box-sizing: border-box;
  border-radius: 4px;
  color: #fff;
  display: inline-block;
  padding: 10px 35px 10px 20px;
  margin: 0 10px;
  font-weight: bold;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  opacity: 1!important;
}
#main_column .button--bk:hover {
  opacity: 0.8!important;
}
#main_column .button--bk span {
  word-break: keep-all;
  position: relative;
  z-index: 3;
}
#main_column .button--bk:link, #main_column .button--bk:visited {
  border: none;
}
#main_column .button--large {
  background: url(/user_data/packages/raku2pc/img/frt_img/ic_ar.svg) no-repeat calc(100% - 30px) 50%;
  background-color: var(--accent-color);
  -webkit-background-size: auto 0.9em;
  background-size: auto 0.9em;
  box-sizing: border-box;
  border-radius: 4px;
  font-size: 20px;
  color: #fff;
  display: inline-block;
  padding: 24px 62px 24px 32px;
  margin: 0 10px;
  font-weight: bold;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  opacity: 1!important;
}
#main_column .button--large:before {
  content: "";
  display: block;
  position: absolute;
  width: 0%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  background: var(--accent-color);
  mix-blend-mode: lighten;
  transition: all .5s ease;
}
#main_column .button--large:hover:before {
  content: "";
  width: 100%;
}
#main_column .button--large span {
  word-break: keep-all;
  position: relative;
  z-index: 3;
}

#main_column .button--large:link, #main_column .button--large:visited {
  border: none;
}
#main_column .frt__boxtext .button--bk {
  display: block;
  background: var(--accent-color);
  border-radius: 4px;
  box-sizing: border-box;
  font-size: 1em;
  color: #fff;
  text-align: center;
  padding: 14px 30px;
  margin: 0;
  font-weight: bold;
  text-decoration: none;
}
#main_column .frt .photo {
  width: 100%;
  max-width: 558px;
  height: 0;
  padding-bottom: calc(418.5 / 558 * 100%);
  display: block;
  left: 0;
  position: relative;
}
#main_column .frt .photo a[rel="fancybox_group"] {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}
#main_column .frt .raku2_image_lower_wrapper .photo img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  max-width: inherit;
  max-height: inherit;
  min-width: inherit;
  min-height: inherit;
  border: none;
  object-fit: scale-down;
}
#main_column .frt .raku2_sub_image_container {
  max-width: 558px;
  display: flex;
  flex-wrap: wrap;
  margin-top: 24px;
}
#main_column .frt .raku2_sub_image_container .sub_photo {
	margin-top: 0;
	min-width: 70px;
	min-height: 70px;
	max-width: 70px;
	max-height: 70px;
}
#main_column .frt .raku2_sub_image_container .sub_photo:not(:nth-child(6n)) {
	margin-right: 25px;
	margin-bottom: 25px;
}
#main_column .frt .raku2_sub_image_container .sub_photo:nth-child(6n) {
	margin-right: 25px;
	margin-bottom: 25px;
}
#main_column .frt .raku2_sub_image_container .sub_photo img {
	min-width: 70px;
	min-height: 70px;
	max-width: 70px;
	max-height: 70px;
	object-fit: scale-down;
}
#main_column .frt .picture_message {
  position: absolute;
  bottom: 0;
  left: 0;
  background: var(--accent-color);
  width: 100%;
  z-index: 3;
  text-align: center;
  color: #fff;
  padding: 6px;
  box-sizing: border-box;
}
#main_column .frt .picture_message a {
  color: #fff;
}
#main_column .frt .frt__box--product {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -ms-align-items: stretch;
  align-items: stretch;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

#main_column .frt__box--product .frt__boximage {
  width: calc(498 / 1024 * 100%);
  max-width: 498px;
  margin: 0;
}
#main_column .frt__box--product .frt__boxtext {
  width: calc(462 / 1024 * 100%);
  max-width: 462px;
  margin: 0;
}
#main_column .frt .frt__box--product .photo {
  max-width: 498px;
  padding-bottom: clamp(100px,100%,498px);
  overflow: hidden;
  border-radius: 4px;
}
#main_column .frt__box--product .frt_pickup__name {
    font-family: "Noto Serif JP", serif;
    font-weight: 500;
    font-size: 24px;
    color: var(--rt-bk);
    line-height: 42px;
}
#main_column .frt__box--product .frt_pickup__code {
  font-weight: 400;
  font-size: 12px;
  margin: 10px auto;
}
#main_column .frt__box--product .frt_pickup__price {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 24px;
  font-feature-settings: 'palt' 1;
}
#main_column .frt__box--product .frt_pickup__price .tax {
  font-size: 14px;
  font-weight: 400;
}
#main_column .frt_button {
  display: block;
  margin: 16px auto 36px;
}
#main_column .frt__box--product .frt_button--cartin {
  display: block;
  color: #ffffff;
    border-radius: 4px;
    font-size: 1.2em;
    font-weight: 700;
    letter-spacing: 0;
    padding: 15px 2px;
  background-color: var(--accent-color);
    -webkit-background-size: auto 0.9em;
    background-size: auto 0.9em;
  text-decoration: none;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: all .5s ease;
}
#main_column .frt__box--product .frt_button--cartin:hover {
  opacity: 0.8!important;
}

#main_column .frt__box--product .frt_button--cartin span {
  position: relative;
  z-index: 3;
}

#main_column .frt__box--product .frt_button--detail {
  display: block;
  box-sizing: border-box;
    border: 2px solid var(--accent-color);
    border-radius: 4px;
    color: var(--accent-color);
    font-size: 1.2em;
    font-weight: bold;
    padding: 15px 0 15px 0;
    width: 100%;
    margin-top: 14px ;
    background: #fff url(/user_data/packages/raku2pc/img/frt_img/ic_ar_bk.svg) no-repeat calc(100% - 1em) 50%;
    -webkit-background-size: auto 0.9em;
    background-size: auto 0.9em;
  text-decoration: none;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: all .5s ease;
}
#main_column .frt__box--product .frt_button--detail:hover {
  opacity: 0.8!important;
}

#main_column .frt__box--product .frt_button--detail span {
  position: relative;
  z-index: 3;
}

#main_column .frt__box--product p {
  font-size: 14px;
}

#main_column .frt_list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-align-items: stretch;
    align-items: stretch;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: flex-start;
  position: relative;
  margin: 0 auto;
  width: 100%;
  min-width: 1024px;
}
#main_column .frt_list--4col .frt_list__item {
  width: calc((100% - 32px * 3 ) / 4);
  max-width: 232px;
  margin-right: 32px;
  margin-top: 32px;
}

#main_column .frt_list--4col .frt_list__item:nth-of-type(4n) {
  margin-right: 0;
}
#main_column .frt_list--4col .frt_list__item:nth-of-type(1) ,
#main_column .frt_list--4col .frt_list__item:nth-of-type(2) ,
#main_column .frt_list--4col .frt_list__item:nth-of-type(3) ,
#main_column .frt_list--4col .frt_list__item:nth-of-type(4) {
  margin-top: 0;
}
#main_column .frt_list--3col .frt_list__item {
  width: calc((100% - 48px ) * 2 / 3);
  max-width: 309px;
  margin-right: 48px;
  margin-top: 48px;
}
#main_column .frt_list--3col .frt_list__item:nth-of-type(3n) {
  margin-right: 0;
}
#main_column .frt_list--3col .frt_list__item:nth-of-type(1) ,
#main_column .frt_list--3col .frt_list__item:nth-of-type(2) ,
#main_column .frt_list--3col .frt_list__item:nth-of-type(3) {
  margin-top: 0;
}
#main_column .frt_list__item {
  display: block;
  position: relative;
}
#main_column .frt_list__item a {
  display: block;
  position: relative;
}
#main_column .frt_list__image {
  display: block;
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  border-radius: 4px;
  overflow: hidden;
}
#main_column .frt_list__image img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: scale-down;
  transition: all .5s ease;
  transform: scale(1);
}
#main_column a:hover .frt_list__image img {
  transform: scale(1.05);
}
#main_column .frt_list__name {
  display: block;
  text-align: center;
  font-size: var(--typ-text);
  margin-top: 16px;
}
#main_column .frt_list__price {
  display: block;
  text-align: center;
  font-size: 12px;
  margin-bottom: 0px;
}
#main_column .frt_list__text {
  display: block;
  font-size: 12px;
  margin-top: 16px;
}
#main_column .frt_list__text:empty {
  display: none;
}
#main_column .frt_list__link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -ms-align-items: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: flex-start;
  width: 100%;
  background: url(/user_data/packages/raku2pc/img/frt_img/ic_ar_bk.svg) no-repeat 100% 54%;
  -webkit-background-size: auto .9em;
  background-size: auto .9em;
  margin-top: 16px;
  font-weight: bold;
}
#main_column a:hover .frt_list__link {
  background: url(/user_data/packages/raku2pc/img/frt_img/ic_ar_accent.svg) no-repeat 100% 54%;
  -webkit-background-size: auto .9em;
  background-size: auto .9em;
}
.datalist {
  width: 100%;
  margin: 0 auto;
  display: table;
}
.datalist dl {
  display: table-row;
}
.datalist dl:first-of-type dt ,
.datalist dl:first-of-type dd {
  border-top: 1px solid #e7e5e4;
}
.datalist dt {
  display: table-cell;
  border-bottom: 1px solid #e7e5e4;
  box-sizing: border-box;
  padding: 16px 0;
  vertical-align: middle;
  width: 132px;
}
.datalist dd {
  display: table-cell;
  border-bottom: 1px solid #e7e5e4;
  box-sizing: border-box;
  padding: 16px 32px;
  vertical-align: middle;
  width: calc(100% - 128px);
}
.custom_page #guide_area .contents_outer {
  margin-bottom: var(--spc-sect-in);
}
.custom_page #guide_area > .contents_outer:last-child {
  margin-bottom: 0;
}
.LC_Page_Order #undercolumn ,
.LC_Page_Guide_Privacy #undercolumn {
  margin-top: 0;
}
.LC_Page_Order .custom_page ,
.LC_Page_Guide_Privacy .custom_page {
  margin-top: var(--spc-sect-in);
}

h1.detail__subtitle {
font-size: 48px;
color:var(--accent-color);
display: block;
font-family: "Oswald", sans-serif;
font-optical-sizing: auto;
font-weight: 600;
font-style: normal;
margin: 0px auto 32px;
text-align: center;
}