@import url(//fonts.googleapis.com/earlyaccess/notosansjapanese.css);
<style type="text/css">@charset 'utf-8';
* {
  box-sizing: border-box;
}

a, article, aside, audio, b, body, blockquote, button, caption, dd, div, dl, dt, em, footer, form, h1, h2, h3, h4, h5, h6, header, html, i, iframe, img, input, label, li, mark, menu, nav, object, ol, p, q, section, select, small, span, strong, table, tbody, td, textarea, tfoot, th, thead, tr, ul, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
}

body, button, input, select, textarea {
  color: #333;
  font: 400 14px/1.5 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
}

button {
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
}

iframe {
  vertical-align: bottom;
}

a {
  color: #062367;
  /*** 201803 MOD #333 ***/
  text-decoration: underline;
}

a:hover {
  text-decoration: underline;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: top;
}

input {
  outline: none;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
}

input: -webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #fff inset;
}

input:: -webkit-input-placeholder {
  color: #999;
}

input:: -moz-placeholder {
  opacity: 1;
  color: #999;
}

input: -ms-input-placeholder {
  color: #999;
}

input[type='date'], input[type='datetime'], input[type='datetime-local'], input[type='email'], input[type='month'], input[type='number'], input[type='password'], input[type='search'], input[type='tel'], input[type='text'], input[type='time'], input[type='url'], input[type='week'] {
  width: 100%;
  padding: 0 8px;
}

input[type='button'], input[type='image'], input[type='reset'], input[type='submit'] {
  text-align: center;
}

input[type='submit'] {
  -webkit-appearance: none;
}

input[type='checkbox'], input[type='radio'] {
  width: 20px;
  height: 20px;
  margin-right: .5em;
  vertical-align: middle;
}

ol, ul {
  list-style: none;
}

select {
  width: auto;
  padding: 0 8px;
  outline: none;
  background: #fff url(/img/select.jpg) no-repeat right 5px center;
  border: 1px solid #ccc;
  border-radius: 3px;
}

textarea {
  width: 100%;
  min-height: 100px;
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding: 6px 8px;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
  resize: vertical;
}

@media screen and (min-width: 960px) {
  button {
    height: 30px;
  }
  select {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  button {
    height: 44px;
  }
  input {
    height: 70px;
  }
  select {
    height: 44px;
  }
}

.cf:after, .clearfix:after {
  content: '';
  display: block;
  clear: both;
  height: 0;
}

#sysAll #sysHeader, #sysAll #sysMain, #sysAll #sysAside, #sysAll #sysFooter {
  float: none;
  width: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
}

#sysAll .sysContent {
  margin: 0;
  padding: 0;
}

#sysHeader {
  margin-bottom: 20px!important;
}

#sysHeader .header {
  .sysFuncText header .aiContent {
    background-color: #23466e;
  }
}

#sysHeader .header .inner .logo {
  float: left;
}

#sysHeader .header .inner .menuBtn {
  display: none;
  float: right;
  width: 44px;
  height: 44px;
  padding: 10px 6px;
}

.menuBtn span {
  display: block;
  width: 24px;
  height: 4px;
  background: #333;
}

.menuBtn span: not(: last-child) {
  margin-bottom: 6px;
}

.menuBtn.active {
  position: relative;
  padding: 0;
  border-width: 10px 6px;
  border-style: solid;
  border-color: transparent;
}

.menuBtn.active span {
  position: absolute;
  margin-bottom: 0;
}

.menuBtn.active span:first-child {
  top: 10px;
  transform: rotate(45deg);
}

#sysHeader .header .inner .menuBtn.active span:nth-child(2) {
  display: none;
}

.menuBtn.active span: last-child {
  top: 10px;
  transform: rotate(135deg);
}

#sysHeader .header .gnav {
  margin-top: 8px;
  margin-bottom: 10px;
  /*** 201803 ADD ***/
  border: 1px solid #062367;
  /*** 201803 MOD #333 ***/
  border-width: 1px 0;
  background-color: #23466e;
  /*** 201803 ADD ***/
}

#sysHeader .header .gnav li {
  float: left;
}

#sysHeader .header .gnav li a {
  display: block;
  height: 50px;
  margin: 0 5px;
  border-radius: 3px;
  transition: background .3s, color .3s;
  font-weight: bold;
  line-height: 50px;
  text-align: center;
  text-indent: 1px;
  text-decoration: none;
  color: #fff;
}

#sysHeader .header .gnav li a:hover {
  background: #f4f4f4;
  color: #062367;
}

@media screen and (min-width: 960px) {
  #sysHeader .header .gnav {
    padding: 5px 0;
  }
  #sysHeader .header .gnav li {
    width: calc(100% / 7);
    border-right: 1px dotted #999;
  }
  #sysHeader .header .gnav li:first-child {
    border-left: 1px dotted #999;
  }
  #sysHeader .header .headMenuList {
    right: calc((100% - 960px)/2);
    bottom: 67px;
  }
}

@media screen and (max-width: 959px) and (min-width: 600px) {
  #sysHeader .header .gnav li {
    width: 25%;
  }
  #sysHeader .header .gnav li: not(:nth-child(4n)) {
    border-right: 1px dotted #999;
  }
  #sysHeader .header .gnav li:nth-child(-n+4) {
    border-bottom: 1px dotted #ccc;
  }
  #sysHeader .header .headMenuList {
    right: 5px;
    bottom: 107px;
  }
}

@media screen and (min-width: 600px) {
  #sysHeader .header {
    position: relative;
  }
  #sysHeader .header .headMenuList {
    position: absolute;
    letter-spacing: -.4em;
  }
  #sysHeader .header .headMenuList li {
    display: inline-block;
    margin-left: 1px;
    letter-spacing: normal;
  }
  #sysHeader .header .headMenuList li a {
    display: block;
    padding: 0 1em;
    background: #666;
    transition: background .3s;
    color: #fff;
    font-size: 12px;
    line-height: 24px;
    text-decoration: none;
  }
  #sysHeader .header .headMenuList li a:hover {
    background: #333;
  }
}

@media screen and (max-width: 599px) {
  #sysHeader .header {
    padding-top: 0;
  }
  #sysHeader .header .inner {
    padding: 5px;
    border-bottom: 1px solid #ccc;
  }
  #sysHeader .header .inner .logo {
    position: relative;
    width: calc(100% - 60px);
    height: 61px;
  }
  #sysHeader .header .inner .logo img {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
  }
  #sysHeader .header .inner .menuBtn {
    display: block;
  }
  #sysHeader .header .headMenu {
    display: none;
  }
  #sysHeader .header .gnav {
    margin-top: 0;
    border-width: 0;
  }
  #sysHeader .header .gnav ul {
    padding: 0;
    border-bottom: 0;
  }
  #sysHeader .header .gnav ul li {
    float: none;
  }
  #sysHeader .header .gnav ul li a {
    height: 44px;
    border-bottom: 1px solid #ccc;
    margin: 0;
    padding: 0 10px;
    font-size: 15px;
    font-weight: 400;
    line-height: 44px;
    text-align: left;
  }
  #sysHeader .header .headMenuList li a {
    display: block;
    position: relative;
    height: 40px;
    padding: 0 30px;
    background: #333;
    border-bottom: 1px solid #ccc;
    color: #fff;
    font-size: 13px;
    line-height: 40px;
    text-direction: none;
  }
  #sysHeader .header .headMenuList li a:before {
    content: '';
    display: block;
    position: absolute;
    top: 17px;
    left: 15px;
    width: 5px;
    height: 5px;
    border-width: 1px;
    border-style: solid;
    border-color: #fff #fff transparent transparent;
    transform: rotate(45deg);
  }
}

.hedear.navi {
  background: #ffffff;
  color: #727272;
  width: auto;
  padding: 15px 8px;
  border: 2px solid #dddddd;
  border-radius: 8px;
  -moz-border-radius: 8px;
  -o-border-radius: 8px;
  -ms-border-radius: 8px;
  float: right;
  margin: 28px 0 0 0;
  text-align: right;
}

.square_btn {
  position: relative;
  display: inline-block;
  font-weight: bold;
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: #FFF;
  background: #00bcd4;
  transition: .4s;
}

.square_btn:hover {
  background: #1ec7bb;
}

#sysAll {
  max-width: 100%;
  padding: 0;
  background-color: transparent;
}

#sysFooter {
  margin-top: 60px!important;
}

#sysFooter .footer .footMenu .footMenuWrap p {
  opacity: .9;
  font-size: 13px;
  line-height: 1.8;
}

#sysFooter .footer .footMenu .footMenuWrap p: not(: last-child) {
  margin-bottom: 10px;
}

#sysFooter .footer .copyright {
  padding: 10px;
  background: #efefef;
  /*** 201803 MOD #333 ***/
  color: #fff;
  font-size: 12px;
  text-align: center;
}


/*** 201803 ADD-st ***/

#sysFooter td {
  padding: 10px;
}

#sysFooter .footerguide01 {
  width: 960px;
  margin: auto;
}

@media screen and (max-width: 780px) {
  #sysFooter .footerguide01 {
    width: 100%!important;
  }
  #sysFooter td {
    width: 100%!important;
  }
}


/*** 201803 ADD-ed ***/

@media screen and (min-width: 960px) {
  #sysFooter .footer {
    background: #efefef;
    /*** 201803 MOD #666 ***/
  }
  #sysFooter .footer .inner {
    padding: 30px 0 15px;
  }
  #sysFooter .footer .footTtl {
    margin-bottom: 20px;
    padding: 0 8px;
    border-bottom: 1px solid #fff;
    color: #fff;
    font-size: 20px;
  }
  #sysFooter .footer .footMenu {
    width: calc(100% + 30px);
    margin: -15px 0 0 -15px;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 15px;
  }
  #sysFooter .footer .footMenu td {
    padding: 15px 10px;
    background: #fff;
    border-radius: 3px;
  }
  #sysFooter .footer .footMenu .footMenuTtl {
    margin-bottom: 15px;
    padding: 0 5px;
    border-bottom: 1px solid #333;
    font-size: 15px;
    font-weight: bold;
  }
  #sysFooter .footer .footMenu .footMenuWrap {
    display: block!important;
    padding: 0 10px;
  }
}

@media screen and (max-width: 959px) {
  #sysFooter .footer .footTtl {
    margin-bottom: 10px;
    color: #062367;
    font-size: 20px;
    font-weight: 400;
    text-align: center;
  }
  #sysFooter .footer .footMenu {
    display: block;
    margin-bottom: 20px;
    border-bottom: 1px solid #666;
  }
  #sysFooter .footer .footMenu tbody, #sysFooter .footer .footMenu tr, #sysFooter .footer .footMenu td {
    display: block;
  }
  #sysFooter .footer .footMenu .footMenuTtl {
    position: relative;
    padding: 15px;
    border-top: 1px solid #666;
    font-size: 16px;
  }
  #sysFooter .footer .footMenu .footMenuTtl:after {
    content: '';
    display: block;
    position: absolute;
    top: 20px;
    right: 15px;
    width: 10px;
    height: 10px;
    border-width: 1px;
    border-style: solid;
    border-color: #062367 #062367 transparent transparent;
    transform: rotate(135deg);
  }
  #sysFooter .footer .footMenu .footMenuTtl.active:after {
    top: 26px;
    transform: rotate(315deg);
  }
  #sysFooter .footer .footMenu .footMenuWrap {
    display: none;
    padding: 15px;
    border-top: 1px dotted #999;
  }
}

.btn {
  display: block;
  max-width: 400px;
  margin: 0;
  padding: 0;
  border-width: 0;
  border-radius: 3px;
  transition: .3s;
  color: #fff;
  font: normal 13px / normal 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
  text-shadow: none;
  cursor: pointer;
}

.btn:hover {
  opacity: .8;
  color: #fff;
}

@media screen and (min-width: 960px) {
  .btn {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  .btn {
    height: 44px;
  }
}

.btnBack {
  position: absolute;
  bottom: 0;
  left: 0;
  width: calc(50% - 5px);
  background: #607d8b;
}

.btnNext {
  position: absolute;
  bottom: 0;
  right: 0;
  width: calc(50% - 5px);
  background: #f44336;
}

.sslMain {
  position: relative;
}

@media screen and (min-width: 960px) {
  .sslMain {
    padding-bottom: 60px!important;
  }
}

@media screen and (max-width: 959px) {
  .sslMain {
    padding-bottom: 74px!important;
  }
}

.sslTitle {
  height: 30px;
  margin-bottom: 20px;
  padding: 0 5px;
  background: transparent;
  border-bottom: 1px solid #333;
  color: #333;
  font: bold 18px/30px 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
}

@media screen and (min-width: 960px) {
  #sysAll #sysWrap {
    width: 75%;
    display: flex;
    flex-direction: row-reverse;
  }
  #sysAll #sysWrap:after {
    content: '';
    display: block;
    clear: both;
    height: 0;
  }
  #sysAll #sysWrap #sysMain {
    width: 55%;
    margin: 1%;
  }
  #sysAll #sysWrap #sysAside {
    width: 20%;
    margin: 1%;
  }
  #sysAll #sysWrap #sysAside>div: not(: last-child) {
    margin-bottom: 30px;
  }
}

@media screen and (max-width: 959px) {
  #sysAll #sysWrap {
    padding: 0 10px;
  }
  #sysAll #sysWrap #sysAside {
    display: none;
  }
}




#sysAll #sysMain .infoContainer h1 {
  font-size: 25px;
  font-weight: 400;
  text-align: center;
}

#sysAll #sysMain .infoContainer .infoContent {
  padding-top: 30px;
}

#sysAll #sysMain .infoContainer .infoContent .ttl {
  padding: 0 5px;
  border-bottom: 1px solid #333;
  font-size: 18px;
  font-weight: 400;
}

#sysAll #sysMain .infoContainer .infoContent .body {
  margin: 20px 10px 0;
}

#sysAll #sysMain .infoContainer .infoContent .body p {
  font-size: 13px;
}

#sysAll #sysMain .infoContainer .infoContent .body p: not(: last-child) {
  margin-bottom: 20px;
}

#sysAll #sysMain .infoContainer .infoContent .body p b {
  display: inline-block;
  margin-bottom: 5px;
  font-size: 14px;
  opacity: .9;
}

#sysAll .inner {
  margin-right: auto;
  margin-left: auto;
}

@media screen and (min-width: 960px) {
  #sysAll .inner {
    width: 960px;
  }
}

.003E {
  position: relative;
  padding-left: 17.5px!important;
}

.003E:before {
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  left: 5px;
  width: 5px;
  height: 5px;
  margin-top: -2.5px;
  background: transparent;
  border: 1px solid #333;
  border-width: 1px 1px 0 0;
  transform: rotate(45deg);
}

#top #sysMain>div: not(: last-child) {
  margin-bottom: 5px;
}

#sysAll .sysHeadline {
  padding: 0 5px 3px;
  border-bottom: 1px solid #333;
  font-size: 1.2rem;
  font-weight: bold;
}

@media screen and (max-width: 599px) {
  #sysAll .sysHeadline {
    font-size: 3.8vw;
  }
}

#sysAll .sysFuncListNav ul li: not(: last-child), #sysAll .sysFuncItemCategory ul li: not(: last-child) {
  border-bottom: 1px dashed #ccc;
}

#sysAll .sysFuncListNav ul li: last-child, #sysAll .sysFuncItemCategory ul li: last-child {
  border-bottom: 1px solid #ccc;
}

#sysAll .sysFuncListNav ul li a, #sysAll .sysFuncItemCategory ul li a {
  padding-left: 17.5px!important;
  position: relative;
  padding: 10px 15px 10px 0;
  transition: background .3s, color .3s;
  font-size: 1rem;
}

#sysAll .sysFuncListNav ul li a:hover, #sysAll .sysFuncItemCategory ul li a:hover {
  background: #f4f4f4;
  color: #062367;
  text-decoration: none;
}

#sysAll .sysFuncItemSearch .sysContent {
  margin-top: 10px;
}

#sysAll .sysFuncItemSearch .sysContent form .sysSearchButton {
  display: block;
  max-width: 400px;
  margin: 0;
  padding: 0;
  border-width: 0;
  border-radius: 3px;
  transition: .3s;
  color: #fff;
  font: normal 13px / normal 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
  text-shadow: none;
  cursor: pointer;
  width: 100%;
  margin: 5px auto 0;
  background: #062367;
}

#sysAll .sysFuncItemSearch .sysContent form .sysSearchButton:hover {
  opacity: .8;
  color: #fff;
}

@media screen and (min-width: 960px) {
  #sysAll .sysFuncItemSearch .sysContent form .sysSearchButton {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  #sysAll .sysFuncItemSearch .sysContent form .sysSearchButton {
    height: 44px;
  }
}

#sysAll .sysFuncInformation .sysContent {
  overflow-x: hidden;
  overflow-y: scroll;
  max-height: 150px;
}

#sysAll .sysFuncInformation .sysContent ul li: not(: last-child) {
  border-bottom: 1px dashed #ccc;
}

#sysAll .sysFuncInformation .sysContent ul li: last-child {
  border-bottom: 1px solid #ccc;
}

#sysAll .sysFuncInformation .sysContent ul li a {
  position: relative;
  padding: 10px;
  transition: background .3s, color .3s;
  font-size: 12px;
}

#sysAll .sysFuncInformation .sysContent ul li a:hover {
  background: #f4f4f4;
  color: #062367;
  text-decoration: none;
}

#sysAll .sysFuncMemberLogin .sysContent {
  margin-top: 10px;
}

#sysAll .sysFuncMemberLogin .sysContent form {
  max-width: 400px;
  margin: 10px auto 0;
}

#sysAll .sysFuncMemberLogin .sysContent form .sysFormItem {
  margin-bottom: 10px;
}

#sysAll .sysFuncMemberLogin .sysContent form .sysFormItem .sysFormLabel {
  opacity: .8;
  font-size: 12px;
  font-weight: bold;
}

#sysAll .sysFuncMemberLogin .sysContent form .sysLoginButton {
  display: block;
  max-width: 400px;
  margin: 0;
  padding: 0;
  border-width: 0;
  border-radius: 3px;
  transition: .3s;
  color: #fff;
  font: normal 13px / normal 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
  text-shadow: none;
  cursor: pointer;
  width: 100%;
  margin: 0 auto;
  background: #f44336;
}

#sysAll .sysFuncMemberLogin .sysContent form .sysLoginButton:hover {
  opacity: .8;
  color: #fff;
}

@media screen and (min-width: 960px) {
  #sysAll .sysFuncMemberLogin .sysContent form .sysLoginButton {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  #sysAll .sysFuncMemberLogin .sysContent form .sysLoginButton {
    height: 44px;
  }
}

#sysAll .sysFuncMemberLogin .sysContent ul {
  max-width: 400px;
  margin: 10px auto 0;
}

#sysAll .sysFuncMemberLogin .sysContent ul li {
  margin-top: 5px;
}

#sysAll .sysFuncMemberLogin .sysContent ul li a {
  position: relative;
  padding-left: 17.5px!important;
  display: block;
  opacity: .8;
  font-size: 12px;
  line-height: 1;
}

#sysAll .sysFuncMemberLogin .sysContent ul li a:before {
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  left: 5px;
  width: 5px;
  height: 5px;
  margin-top: -2.5px;
  background: transparent;
  border: 1px solid #333;
  border-width: 1px 1px 0 0;
  transform: rotate(45deg);
}

#sysAll .sysFuncMemberLogin .sysContent ul li a:hover {
  color: #062367;
  text-decoration: none;
}

#sysAll .sysFuncMemberLogin .sysContent ul li a:hover:before {
  border-color: #062367;
}

#sysAll .sysFuncMemberLogin .sysContent div: last-child {
  max-width: 400px;
  margin: 10px auto 0;
  font-size: 0;
}

#sysAll .sysFuncMemberLogin .sysContent div: last-child a {
  display: block;
  max-width: 400px;
  margin: 0;
  padding: 0;
  border-width: 0;
  border-radius: 3px;
  transition: .3s;
  color: #fff;
  font: normal 13px / normal 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
  text-shadow: none;
  cursor: pointer;
  text-align: center;
}

#sysAll .sysFuncMemberLogin .sysContent div: last-child a:hover {
  opacity: .8;
  color: #fff;
}

@media screen and (min-width: 960px) {
  #sysAll .sysFuncMemberLogin .sysContent div: last-child a {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  #sysAll .sysFuncMemberLogin .sysContent div: last-child a {
    height: 44px;
  }
}

@media screen and (min-width: 960px) {
  #sysAll .sysFuncMemberLogin .sysContent div: last-child a {
    line-height: 30px;
  }
}

@media screen and (max-width: 959px) {
  #sysAll .sysFuncMemberLogin .sysContent div: last-child a {
    line-height: 44px;
  }
}

#sysAll .sysFuncMemberLogin .sysContent div: last-child a:first-child {
  background: #062367;
}

#sysAll .sysFuncMemberLogin .sysContent div: last-child a: last-child {
  margin-top: 5px;
  background: #607d8b;
}

#sysAll .sysFuncMemberLogin .sysContent div: last-child a:hover {
  text-decoration: none;
}

#sysAll .sysFuncCartInfo {
  position: relative;
}

#sysAll .sysFuncCartInfo .sysContent {
  margin-top: 10px;
}

#sysAll .sysFuncCartInfo .sysContent .sysCartInfoItemCount dt, #sysAll .sysFuncCartInfo .sysContent .sysCartInfoTotalPrice dt, #sysAll .sysFuncCartInfo .sysContent .sysCartInfoRemainFreeShipping dt, #sysAll .sysFuncCartInfo .sysContent .sysCartInfoItemCount dd, #sysAll .sysFuncCartInfo .sysContent .sysCartInfoTotalPrice dd, #sysAll .sysFuncCartInfo .sysContent .sysCartInfoRemainFreeShipping dd {
  display: inline;
  font-size: 13px;
}

#sysAll .sysFuncCartInfo .sysContent .sysCartInfoCartIn {
  max-width: 400px;
  margin: 10px auto 0;
}

#sysAll .sysFuncCartInfo .sysContent .sysCartInfoCartIn a {
  width: 100%;
  margin: 5px auto 0;
  background: #f44336;
  display: block;
  max-width: 400px;
  margin: 0;
  padding: 0;
  border-width: 0;
  border-radius: 3px;
  transition: .3s;
  color: #fff;
  font: normal 13px / normal 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
  text-shadow: none;
  cursor: pointer;
  text-align: center;
}

#sysAll .sysFuncCartInfo .sysContent .sysCartInfoCartIn a:hover {
  opacity: .8;
  color: #fff;
}

@media screen and (min-width: 960px) {
  #sysAll .sysFuncCartInfo .sysContent .sysCartInfoCartIn a {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  #sysAll .sysFuncCartInfo .sysContent .sysCartInfoCartIn a {
    height: 44px;
  }
}

#sysAll .sysFuncCartInfo .sysContent .sysCartInfoCartIn a:hover {
  opacity: .8;
  color: #fff;
}

@media screen and (min-width: 960px) {
  #sysAll .sysFuncCartInfo .sysContent .sysCartInfoCartIn a {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  #sysAll .sysFuncCartInfo .sysContent .sysCartInfoCartIn a {
    height: 44px;
  }
}

@media screen and (min-width: 960px) {
  #sysAll .sysFuncCartInfo .sysContent .sysCartInfoCartIn a {
    line-height: 30px;
  }
}

@media screen and (max-width: 959px) {
  #sysAll .sysFuncCartInfo .sysContent .sysCartInfoCartIn a {
    line-height: 44px;
  }
}

#sysAll .sysFuncCartInfo .sysContent .sysCartInfoCartIn a:hover {
  text-decoration: none;
}

#sysAll .sysFuncCartInfo .sysContent ul {
  margin-top: 10px;
}

#sysAll .sysHorizontal li {
  transition: background .3s;
  text-align: center;
}

#sysAll .sysHorizontal li:hover {
  background: #f4f4f4;
}

#sysAll .sysHorizontal li .sysItemImage {
  margin-bottom: 5px;
}

#sysAll .sysHorizontal li .sysItemName {
  font-size: 13px;
  font-weight: bold;
  line-height: 20px;
}

#sysAll .sysHorizontal li .sysItemPrice {
  color: #e83929;
  font-size: 12px;
}

#sysAll .sysHorizontal li .sysItemNum {
  font-size: 12px;
}

#sysAll .sysHorizontal li .sysCartButton {
  display: block;
  max-width: 400px;
  margin: 0;
  padding: 0;
  border-width: 0;
  border-radius: 3px;
  transition: .3s;
  color: #fff;
  font: normal 13px / normal 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
  text-shadow: none;
  cursor: pointer;
  width: 100%;
  margin: 5px auto 0;
  background: #062367;
}

#sysAll .sysHorizontal li .sysCartButton:hover {
  opacity: .8;
  color: #fff;
}

@media screen and (min-width: 960px) {
  #sysAll .sysHorizontal li .sysCartButton {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  #sysAll .sysHorizontal li .sysCartButton {
    height: 44px;
  }
}

#sysAll .sysHorizontal li .sysCartButton[disabled] {
  background: #ccc;
}

@media screen and (min-width: 600px) {
  #sysAll #sysMain .sysHorizontal li {
    width: 25%;
    padding: 15px 10px;
  }
  #sysAll #sysMain .sysHorizontal li:nth-child(4n)+li {
    clear: both;
  }
}

@media screen and (max-width: 599px) {
  #sysAll #sysMain .sysHorizontal li {
    width: 50%;
    padding: 10px;
  }
  #sysAll #sysMain .sysHorizontal li:nth-child(even)+li {
    clear: both;
  }
}

#sysAll #sysMain .sysHorizontal li .sysItemName {
  display: -webkit-box;
  overflow: hidden;
  max-height: 60px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

#sysAll #sysAside .sysHorizontal li {
  float: none;
  width: 100%;
  padding: 15px;
}

#sysAll #sysAside .sysHorizontal li:after {
  content: '';
  display: block;
  clear: both;
  height: 0;
}

#sysAll #sysAside .sysHorizontal li .sysItemImage {
  float: left;
  width: calc(50% - 5px);
}

#sysAll #sysAside .sysHorizontal li .sysItemName, #sysAll #sysAside .sysHorizontal li .sysItemPrice, #sysAll #sysAside .sysHorizontal li .sysItemNum {
  float: right;
  width: calc(50% - 5px);
  text-align: left;
}

#sysAll #sysAside .sysHorizontal li .sysItemPrice, #sysAll #sysAside .sysHorizontal li .sysItemNum {
  margin-top: 5px;
}

#sysAll #sysMain .sysItemListDisp {
  margin-bottom: 10px;
  padding-bottom: 5px;
  border-bottom: 1px solid #ccc;
}

#sysAll #sysMain .sysItemListDisp .sysItemListViewType label {
  margin-left: 1em;
}

#sysAll #sysMain .sysItemListDisp .sysItemListViewType label input[type='radio'] {
  width: 1em;
  height: 1em;
}

#sysAll #sysMain .sysItemList li .sysItemPr {
  margin-top: 5px;
  font-size: 13px;
}

#sysAll #sysMain .sysItemList .sysList li {
  padding: 10px;
  border-top: 0;
}

#sysAll #sysMain .sysItemList .sysList li:after {
  content: '';
  display: block;
  clear: both;
  height: 0;
}

#sysAll #sysMain .sysItemList .sysList li: not(:first-child) {
  border-top: 1px dashed #ccc;
}

#sysAll #sysMain .sysItemList .sysList li: last-child {
  border-bottom: 0;
}

#sysAll #sysMain .sysItemList .sysList li .sysThumbnailImage {
  width: 120px;
  height: 180px;
  margin-right: 10px;
}

#sysAll #sysMain .sysItemList .sysList li .sysThumbnailImage a {
  display: block;
}

#sysAll #sysMain .sysItemList .sysList li .sysThumbnailImage+div {
  width: calc(100% - 130px);
  float: left;
}

#sysAll #sysMain .sysItemList .sysThumbnail li {
  float: left;
  padding: 0;
  text-align: center;
}

#sysAll #sysMain .sysItemList .sysThumbnail li .sysItemName {
  display: -webkit-box;
  overflow: hidden;
  height: 40px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media screen and (min-width: 600px) {
  #sysAll #sysMain .sysItemList .sysThumbnail li {
    width: 25%;
    padding: 10px;
  }
  #sysAll #sysMain .sysItemList .sysThumbnail li:nth-child(4n)+li {
    clear: both;
  }
}

@media screen and (max-width: 599px) {
  #sysAll #sysMain .sysItemList .sysThumbnail li {
    width: 50%;
    padding: 10px;
  }
  #sysAll #sysMain .sysItemList .sysThumbnail li:nth-child(2n)+li {
    clear: both;
  }
}

#sysAll #sysMain .sysForm .sysFormItem: not(:first-child), #sysAll #sysMain .sysOtherAddress .sysFormItem: not(:first-child), #sysAll #sysMain .sysForm .sysFormLabel: not(:first-child), #sysAll #sysMain .sysOtherAddress .sysFormLabel: not(:first-child) {
  margin-top: 20px;
}

#sysAll #sysMain .sysForm .sysFormItem, #sysAll #sysMain .sysOtherAddress .sysFormItem {
  position: relative;
}

#sysAll #sysMain .sysForm .sysFormItem:after, #sysAll #sysMain .sysOtherAddress .sysFormItem:after {
  content: '';
  display: block;
  clear: both;
  height: 0;
}

#sysAll #sysMain .sysForm .sysFormItem .sysFormLabel, #sysAll #sysMain .sysOtherAddress .sysFormItem .sysFormLabel {
  display: inline-block;
  position: relative;
  margin-bottom: 5px;
  color: #333;
  font-size: 15px;
  font-weight: bold;
  line-height: 20px;
}

#sysAll #sysMain .sysForm .sysFormItem .sysFormLabel .sysCartNote, #sysAll #sysMain .sysOtherAddress .sysFormItem .sysFormLabel .sysCartNote {
  margin-left: .5em;
  opacity: .6;
  color: #333;
  font-size: 12px;
  font-weight: normal;
}

#sysAll #sysMain .sysForm .sysFormItem .sysFormLabel .sysRequired, #sysAll #sysMain .sysOtherAddress .sysFormItem .sysFormLabel .sysRequired {
  position: absolute;
  top: 2px;
  left: calc(100% + .5em);
}

#sysAll #sysMain .sysForm .sysFormItem .sysRequired, #sysAll #sysMain .sysOtherAddress .sysFormItem .sysRequired {
  display: block;
  width: 3em;
  background: #e83929;
  color: #fff;
  font-size: 11px;
  font-weight: normal;
  line-height: 16px;
  text-align: center;
}

#sysAll #sysMain .sysForm .sysFormItem .sysRequired:before, #sysAll #sysMain .sysOtherAddress .sysFormItem .sysRequired:before, #sysAll #sysMain .sysForm .sysFormItem .sysRequired:after, #sysAll #sysMain .sysOtherAddress .sysFormItem .sysRequired:after {
  content: none;
}

#sysAll #sysMain .sysForm .sysFormItem .sysErrorMessage, #sysAll #sysMain .sysOtherAddress .sysFormItem .sysErrorMessage {
  margin-bottom: 5px;
  padding: 0;
  color: #e83929;
  font-size: 13px;
  font-weight: bold;
}

#sysAll #sysMain .sysForm .sysFormItem .sysFormField, #sysAll #sysMain .sysOtherAddress .sysFormItem .sysFormField {
  position: relative;
  clear: both;
}

#sysAll #sysMain .sysForm .sysFormItem .sysFormField label: not(:first-child), #sysAll #sysMain .sysOtherAddress .sysFormItem .sysFormField label: not(:first-child) {
  margin-left: 10px;
}

#sysAll #sysMain .sysForm .sysFormItem .sysFormField input, #sysAll #sysMain .sysOtherAddress .sysFormItem .sysFormField input {
  margin: 0;
  padding: 30 8px;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
}

#sysAll #sysMain .sysForm .sysFormItem .sysFormField input[type='checkbox'], #sysAll #sysMain .sysOtherAddress .sysFormItem .sysFormField input[type='checkbox'] {
  margin-right: .5em;
  padding: 0;
}

#sysAll #sysMain .sysForm .sysFormItem .sysFormField input[type='radio'], #sysAll #sysMain .sysOtherAddress .sysFormItem .sysFormField input[type='radio'] {
  margin-right: .5em;
  padding: 0;
  border-radius: 50%;
}

#sysAll #sysMain .sysForm .sysFormItem .sysFormField input[name="zipcode"], #sysAll #sysMain .sysOtherAddress .sysFormItem .sysFormField input[name="zipcode"], #sysAll #sysMain .sysForm .sysFormItem .sysFormField input[maxlength="7"], #sysAll #sysMain .sysOtherAddress .sysFormItem .sysFormField input[maxlength="7"] {
  float: left;
  width: 8em;
  margin-right: .5em;
}

#sysAll #sysMain .sysForm .sysFormItem .sysFormField input[name="birth_year"], #sysAll #sysMain .sysOtherAddress .sysFormItem .sysFormField input[name="birth_year"] {
  width: 4em;
  margin-right: 5px;
}

#sysAll #sysMain .sysForm .sysFormItem .sysFormField input[name="birth_month"], #sysAll #sysMain .sysOtherAddress .sysFormItem .sysFormField input[name="birth_month"], #sysAll #sysMain .sysForm .sysFormItem .sysFormField input[name="birth_day"], #sysAll #sysMain .sysOtherAddress .sysFormItem .sysFormField input[name="birth_day"] {
  width: 3em;
  margin: 0 5px;
}

#sysAll #sysMain .sysForm .sysFormItem .sysFormField textarea, #sysAll #sysMain .sysOtherAddress .sysFormItem .sysFormField textarea {
  margin: 0;
  padding: 6px 8px;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
}

#sysAll #sysMain .sysForm button[name='searchAddress'], #sysAll #sysMain .sysOtherAddress button[name='searchAddress'], #sysAll #sysMain .sysForm button[name='getAddress'], #sysAll #sysMain .sysOtherAddress button[name='getAddress'] {
  float: left;
  width: 60px;
  background: #666;
  border: 0;
  border-radius: 3px;
  color: #fff;
  font-size: 0;
  line-height: normal;
  cursor: pointer;
}

#sysAll #sysMain .sysForm button[name='searchAddress']:before, #sysAll #sysMain .sysOtherAddress button[name='searchAddress']:before, #sysAll #sysMain .sysForm button[name='getAddress']:before, #sysAll #sysMain .sysOtherAddress button[name='getAddress']:before {
  content: '住所検索';
  font-size: 12px;
}

@media screen and (min-width: 960px) {
  #sysAll #sysMain .sysForm button[name='searchAddress'], #sysAll #sysMain .sysOtherAddress button[name='searchAddress'], #sysAll #sysMain .sysForm button[name='getAddress'], #sysAll #sysMain .sysOtherAddress button[name='getAddress'] {
    height: 30px;
  }
}

@media screen and (max-width: 960px) {
  #sysAll #sysMain .sysForm button[name='searchAddress'], #sysAll #sysMain .sysOtherAddress button[name='searchAddress'], #sysAll #sysMain .sysForm button[name='getAddress'], #sysAll #sysMain .sysOtherAddress button[name='getAddress'] {
    height: 44px;
  }
}

#sysAll #sysMain .sysForm .sysAcceptMailmagazine label: empty:before, #sysAll #sysMain .sysOtherAddress .sysAcceptMailmagazine label: empty:before {
  content: 'メールマガジン';
}

#sysItemCategory #sysMain .sysItemCategoryPankuzu {
  font: 13px sans-serif;
}

#sysItemCategory #sysMain .sysItemCategoryPankuzu a {
  font-family: 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
}

#sysItemCategory #sysMain .sysItemCategoryCtl {
  margin: 15px 0 5px;
  padding: 10px;
  border: 1px dashed #ccc;
  border-width: 1px 0;
}

#sysItemDetail #sysMain .sysCategoryPankuzu {
  opacity: .9;
  font: 11px sans-serif;
  background-color: #23466e;
  color:fff;
}

#sysItemDetail #sysMain .sysCategoryPankuzu span: empty {
  display: none;
}

#sysItemDetail #sysMain .sysCategoryPankuzu span: empty+br {
  display: none;
}

#sysItemDetail #sysMain .sysCategoryPankuzu a {
  font: 12px 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
}

#sysItemDetail #sysMain .sysCategoryPankuzu a: first-of-type:before {
  content: '';
  display: block;
  width: calc(100% + 20px);
  height: 1px;
  margin: 0 0 10px -10px;
  background: #666;
}

#sysItemDetail #sysMain .sysCategoryPankuzu a: last-of-type:after {
  content: '';
  display: block;
  width: calc(100% + 20px);
  height: 1px;
  margin: 10px 0 15px -10px;
  background: #666;
}

#sysItemDetail #sysMain .itemImg .sysMainImage {
  padding: 10px;
  background: #fff;
  border: 1px solid #eee;
}

#sysItemDetail #sysMain .itemImg .sysImageDescription {
  margin-top: 5px;
  opacity: .8;
  color: #333;
  font-size: 12px;
  text-align: center;
}

#sysItemDetail #sysMain .itemImg .sysImageDescription: empty {
  display: none;
}

#sysItemDetail #sysMain .itemImg .sysImageList li {
  overflow: hidden;
  width: calc(25% - 7.5px);
  height: auto;
  margin: 10px 0 0;
  padding: 2px;
  background: #fff;
  border: 2px solid #ccc;
  line-height: normal;
  margin-bottom: 5px;
}

#sysItemDetail #sysMain .itemImg .sysImageList li: not(:nth-child(4n)) {
  margin-right: 10px;
}

#sysItemDetail #sysMain .itemImg .sysImageList li.sysCurrent {
  border: 2px solid #999;
}

#sysItemDetail #sysMain .itemImg .sysImageList li img {
  border: 0;
}

#sysItemDetail #sysMain .itemInfo .sysPr:after {
  content: '';
  display: block;
  clear: both;
  height: 0;
}

#sysItemDetail #sysMain .itemInfo .sysPr span {
  display: block;
  float: left;
  margin: 0 5px 15px 0;
  padding: 0 1em;
  background: #062367;
  border-radius: 3px;
  color: #f4f4f4;
  font-size: 11px;
  line-height: 20px;
}

#sysItemDetail #sysMain .itemInfo .sysPr span: empty {
  display: none;
}

#sysItemDetail #sysMain .itemInfo .sysDescription #sysDescription p {
  font-size: 13px;
}

#sysItemDetail #sysMain .itemInfo .sysItemName h1 {
  font-size: 24px;
  font-weight: bold;
}

#sysItemDetail #sysMain .itemInfo .sysItemId {
  margin: 10px 0;
  opacity: .8;
  color: #333;
  font-size: 12px;
}

#sysItemDetail #sysMain .itemInfo .sysRetailPrice {
  color: #e83929;
  font-size: 16px;
}

#sysItemDetail #sysMain .itemInfo .sysExplanation #sysExplanation span {
  margin-top: 20px;
}

#sysItemDetail #sysMain .itemInfo .sysExplanation #sysExplanation span: empty {
  display: none;
}

#sysItemDetail #sysMain .itemInfo .sysForm {
  margin-top: 20px;
}

#sysItemDetail #sysMain .itemInfo .sysForm #sysNumber:after {
  content: '';
  display: block;
  clear: both;
  height: 0;
}

#sysItemDetail #sysMain .itemInfo .sysForm #sysNumber select {
  float: right;
  width: calc(100% - 3em - 10px);
}

#sysItemDetail #sysMain .itemInfo .sysForm #sysNumber .sysNumArea {
  display: none;
}

#sysItemDetail #sysMain .itemInfo .sysForm #sysSubmit {
  margin-top: 10px;
}

#sysItemDetail #sysMain .itemInfo .sysForm #sysSubmit .sysCartButton {
  display: block;
  max-width: 400px;
  margin: 0;
  padding: 0;
  border-width: 0;
  border-radius: 3px;
  transition: .3s;
  color: #fff;
  font: normal 13px / normal 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
  text-shadow: none;
  cursor: pointer;
  width: 100%;
  max-width: 100%;
  height: 44px!important;
  background: #f44336;
}

#sysItemDetail #sysMain .itemInfo .sysForm #sysSubmit .sysCartButton:hover {
  opacity: .8;
  color: #fff;
}

@media screen and (min-width: 960px) {
  #sysItemDetail #sysMain .itemInfo .sysForm #sysSubmit .sysCartButton {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  #sysItemDetail #sysMain .itemInfo .sysForm #sysSubmit .sysCartButton {
    height: 44px;
  }
}

#sysItemDetail #sysMain .itemInfo .sysForm #sysWishlist {
  margin-top: 10px;
}

#sysItemDetail #sysMain .itemInfo .sysForm #sysWishlist .sysButton {
  display: block;
  max-width: 400px;
  margin: 0;
  padding: 0;
  border-width: 0;
  border-radius: 3px;
  transition: .3s;
  color: #fff;
  font: normal 13px / normal 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
  text-shadow: none;
  cursor: pointer;
  width: 100%;
  max-width: 100%;
  background: #607d8b;
}

#sysItemDetail #sysMain .itemInfo .sysForm #sysWishlist .sysButton:hover {
  opacity: .8;
  color: #fff;
}

@media screen and (min-width: 960px) {
  #sysItemDetail #sysMain .itemInfo .sysForm #sysWishlist .sysButton {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  #sysItemDetail #sysMain .itemInfo .sysForm #sysWishlist .sysButton {
    height: 44px;
  }
}

#sysItemDetail #sysMain .itemInfo .sysForm .sysShare {
  margin-top: 20px;
  padding: 0;
}

@media screen and (min-width: 600px) {
  #sysItemDetail #sysMain .itemImg {
    float: left;
    width: 300px;
    margin-right: 20px;
  }
  #sysItemDetail #sysMain .itemInfo {
    float: right;
    width: calc(100% - 320px);
  }
}

@media screen and (max-width: 599px) {
  #sysItemDetail #sysMain .itemInfo {
    margin-top: 20px;
  }
}

#sysItemDetail #sysModalWindow {
  background-color: rgba(0, 0, 0, .6);
}

#sysItemDetail #sysModalWindow .sysModalContent {
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#sysFormIndex #sysMain {
  position: relative;
}

@media screen and (min-width: 960px) {
  #sysFormIndex #sysMain {
    padding-bottom: 60px!important;
  }
}

@media screen and (max-width: 959px) {
  #sysFormIndex #sysMain {
    padding-bottom: 74px!important;
  }
}

#sysFormIndex #sysMain h2 {
  height: 30px;
  margin-bottom: 20px;
  padding: 0 5px;
  background: transparent;
  border-bottom: 1px solid #333;
  color: #333;
  font: bold 18px/30px 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
}

#sysFormIndex #sysMain input[type='submit'].sysNextSubmit {
  display: block;
  max-width: 400px;
  margin: 0;
  padding: 0;
  border-width: 0;
  border-radius: 3px;
  transition: .3s;
  color: #fff;
  font: normal 13px / normal 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
  text-shadow: none;
  cursor: pointer;
}

#sysFormIndex #sysMain input[type='submit'].sysNextSubmit:hover {
  opacity: .8;
  color: #fff;
}

@media screen and (min-width: 960px) {
  #sysFormIndex #sysMain input[type='submit'].sysNextSubmit {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  #sysFormIndex #sysMain input[type='submit'].sysNextSubmit {
    height: 44px;
  }
}

#sysFormIndex #sysMain input[type='submit'].sysNextSubmit {
  position: absolute;
  bottom: 0;
  right: 0;
  width: calc(50% - 5px);
  background: #f44336;
}

#sysFormIndex #sysMain .sysForm .sysFormLabel {
  float: left;
}

#sysFormIndex #sysMain .sysForm .sysRequired {
  float: left;
  margin: 2px 0 0 .5em;
}

#sysFormConfirm #sysMain {
  position: relative;
}

@media screen and (min-width: 960px) {
  #sysFormConfirm #sysMain {
    padding-bottom: 60px!important;
  }
}

@media screen and (max-width: 959px) {
  #sysFormConfirm #sysMain {
    padding-bottom: 74px!important;
  }
}

#sysFormConfirm #sysMain h2 {
  height: 30px;
  margin-bottom: 20px;
  padding: 0 5px;
  background: transparent;
  border-bottom: 1px solid #333;
  color: #333;
  font: bold 18px/30px 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
}

#sysFormConfirm #sysMain button[name='action_front_form_index'], #sysFormConfirm #sysMain input[type='submit'].sysNextSubmit {
  display: block;
  max-width: 400px;
  margin: 0;
  padding: 0;
  border-width: 0;
  border-radius: 3px;
  transition: .3s;
  color: #fff;
  font: normal 13px / normal 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
  text-shadow: none;
  cursor: pointer;
}

#sysFormConfirm #sysMain button[name='action_front_form_index']:hover, #sysFormConfirm #sysMain input[type='submit'].sysNextSubmit:hover {
  opacity: .8;
  color: #fff;
}

@media screen and (min-width: 960px) {
  #sysFormConfirm #sysMain button[name='action_front_form_index'], #sysFormConfirm #sysMain input[type='submit'].sysNextSubmit {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  #sysFormConfirm #sysMain button[name='action_front_form_index'], #sysFormConfirm #sysMain input[type='submit'].sysNextSubmit {
    height: 44px;
  }
}

#sysFormConfirm #sysMain button[name='action_front_form_index'] {
  position: absolute;
  bottom: 0;
  left: 0;
  width: calc(50% - 5px);
  background: #607d8b;
}

#sysFormConfirm #sysMain input[type='submit'].sysNextSubmit {
  position: absolute;
  bottom: 0;
  right: 0;
  width: calc(50% - 5px);
  background: #f44336;
}

#sysFormThanks #sysMain {
  position: relative;
}

@media screen and (min-width: 960px) {
  #sysFormThanks #sysMain {
    padding-bottom: 60px!important;
  }
}

@media screen and (max-width: 959px) {
  #sysFormThanks #sysMain {
    padding-bottom: 74px!important;
  }
}

#sysFormThanks #sysMain h2 {
  height: 30px;
  margin-bottom: 20px;
  padding: 0 5px;
  background: transparent;
  border-bottom: 1px solid #333;
  color: #333;
  font: bold 18px/30px 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
}

#sysFormThanks #sysMain {
  padding-bottom: 0;
}

.sysCart #sysMain {
  position: relative;
}

@media screen and (min-width: 960px) {
  .sysCart #sysMain {
    padding-bottom: 60px!important;
  }
}

@media screen and (max-width: 959px) {
  .sysCart #sysMain {
    padding-bottom: 74px!important;
  }
}

.sysCart #sysMain h2 {
  height: 30px;
  margin-bottom: 20px;
  padding: 0 5px;
  background: transparent;
  border-bottom: 1px solid #333;
  color: #333;
  font: bold 18px/30px 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
}

.sysCart #sysWrap #sysMain input[type='submit'].sysBackButton, .sysCart #sysWrap #sysMain input[type='submit'].sysBackSubmitArea, .sysCart #sysWrap #sysMain input[type='submit'].sysNextSubmit, .sysCart #sysWrap #sysMain button[type='submit'].sysNextSubmit, .sysCart #sysWrap #sysMain input[type='submit'].sysBtnChange, .sysCart #sysWrap #sysMain input[type='submit'].sysLoginButton {
  display: block;
  max-width: 400px;
  margin: 0;
  padding: 0;
  border-width: 0;
  border-radius: 3px;
  transition: .3s;
  color: #fff;
  font: normal 13px / normal 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
  text-shadow: none;
  cursor: pointer;
}

.sysCart #sysWrap #sysMain input[type='submit'].sysBackButton:hover, .sysCart #sysWrap #sysMain input[type='submit'].sysBackSubmitArea:hover, .sysCart #sysWrap #sysMain input[type='submit'].sysNextSubmit:hover, .sysCart #sysWrap #sysMain button[type='submit'].sysNextSubmit:hover, .sysCart #sysWrap #sysMain input[type='submit'].sysBtnChange:hover, .sysCart #sysWrap #sysMain input[type='submit'].sysLoginButton:hover {
  opacity: .8;
  color: #fff;
}

@media screen and (min-width: 960px) {
  .sysCart #sysWrap #sysMain input[type='submit'].sysBackButton, .sysCart #sysWrap #sysMain input[type='submit'].sysBackSubmitArea, .sysCart #sysWrap #sysMain input[type='submit'].sysNextSubmit, .sysCart #sysWrap #sysMain button[type='submit'].sysNextSubmit, .sysCart #sysWrap #sysMain input[type='submit'].sysBtnChange, .sysCart #sysWrap #sysMain input[type='submit'].sysLoginButton {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  .sysCart #sysWrap #sysMain input[type='submit'].sysBackButton, .sysCart #sysWrap #sysMain input[type='submit'].sysBackSubmitArea, .sysCart #sysWrap #sysMain input[type='submit'].sysNextSubmit, .sysCart #sysWrap #sysMain button[type='submit'].sysNextSubmit, .sysCart #sysWrap #sysMain input[type='submit'].sysBtnChange, .sysCart #sysWrap #sysMain input[type='submit'].sysLoginButton {
    height: 44px;
  }
}

.sysCart #sysWrap #sysMain input[type='submit'].sysBackButton, .sysCart #sysWrap #sysMain input[type='submit'].sysBackSubmitArea {
  position: absolute;
  bottom: 0;
  left: 0;
  width: calc(50% - 5px);
  background: #607d8b;
}

.sysCart #sysWrap #sysMain input[type='submit'].sysNextSubmit, .sysCart #sysWrap #sysMain button[type='submit'].sysNextSubmit, .sysCart #sysWrap #sysMain input[type='submit'].sysBtnChange, .sysCart #sysWrap #sysMain input[type='submit'].sysLoginButton {
  position: absolute;
  bottom: 0;
  right: 0;
  width: calc(50% - 5px);
  background: #f44336;
}

.sysCart #sysMain {
  color: #333;
}

.sysCart #sysMain a {
  color: #333;
}

.sysCart #sysMain .sysBox {
  position: relative;
  margin: 0;
  border: 0px solid #ccc;
  border-radius: 0;
  box-shadow: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
}

.sysCart #sysMain .sysBox:after {
  content: '';
  display: block;
  clear: both;
  height: 0;
}

.sysCart #sysMain .sysBox>a {
  display: block;
}

.sysCart #sysMain .sysBox>a .sysProductImg {
  float: none;
  width: 100%;
  margin: 0;
  border-radius: 3px;
}

.sysCart #sysMain .sysBox .sysProduct .sysItemName a {
  color: #333;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.2;
}

.sysCart #sysMain .sysBox .sysProduct .sysItemRetailPrice {
  font-size: 13px;
}

.sysCart #sysMain .sysBox hr {
  display: none;
}

.sysCart #sysMain .sysBox hr+div {
  margin: 5px 0;
  font-size: 0;
}

.sysCart #sysMain .sysBox hr+div:before {
  content: '数量：';
  display: block;
  float: left;
  font-size: 13px;
}

.sysCart #sysMain .sysBox hr+div div {
  float: left;
}

.sysCart #sysMain .sysBox hr+div div select {
  float: left;
  width: 100%;
  margin: 0;
}

.sysCart #sysMain .sysBox hr+div .sysNumArea {
  float: left;
  width: calc(100% - (100% / 3 - 3em));
}

.sysCart #sysMain .sysBox div.sysDeleteArea {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 30px;
  height: 30px;
}

.sysCart #sysMain .sysBox div.sysDeleteArea .sysButton.sysDeleteArea {
  width: 30px;
  min-width: 30px;
  height: 30px;
  margin: 0;
  background: transparent url(http: //morioka-tirol.aispr.jp/img/cart/btn-delete.jpg) no-repeat center center / 60% 60%;
  border-width: 0;
  font-size: 0;
}

.sysCart #sysMain .sysBox div.sysDeleteArea .sysButton.sysDeleteArea:hover {
  opacity: .6;
}

.sysCart #sysMain .sysNavImg {
  margin-bottom: 20px;
}

.sysCart#sysBasket #sysMain {
  position: relative;
  padding-top: 50px;
}

.sysCart #sysBasket #sysMain h2 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.sysCart#sysBasket #sysMain .sysTotal {
  margin-bottom: 20px;
}

.sysCart#sysBasket #sysMain .sysTotal .sysBox {
  padding: 0 10px 5px;
  border: 0;
  border-bottom: 1px solid #333;
}

.sysCart#sysBasket #sysMain .sysTotal .sysBox .sysTotalTxt {
  text-shadow: none;
}

.sysCart#sysBasket #sysMain .nav li {
  margin-top: 10px;
}

.sysCart#sysRegi #sysMain #sysPurchaseAuthMember .sysForm .sysFormItem {
  margin: 0;
}

.sysCart#sysRegi #sysMain #sysPurchaseAuthMember .sysForm .sysFormItem: not(: last-child) {
  margin-bottom: 10px;
}

.sysCart#sysRegi #sysMain #sysPurchaseAuthMember .sysForm .sysFormItem .sysFormLabel {
  font-size: 18px;
  font-weight: bold;
}

.sysCart#sysRegi #sysMain #sysPurchaseAuthMember .sysForm .sysFormItem .sysFormField input {
  margin: 0;
}

.sysCart#sysRegi #sysMain #sysRegisterForm, .sysCart#sysRegi #sysMain #sysPurchaseAuthCustomer {
  margin-top: 30px;
}



.sysCart#sysBillingAddress #sysMain input[type='text'], .sysCart#sysBillingAddress #sysMain input[type='password'], .sysCart#sysBillingAddress #sysMain input[type='email'], .sysCart#sysBillingAddress #sysMain input[type='number'], .sysCart#sysBillingAddress #sysMain input[type='tel'], .sysCart#sysBillingAddress #sysMain input[type='search'], .sysCart#sysBillingAddress #sysMain textarea {
  margin: 0;
  padding: 0 8px;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
}

.sysCart#sysPayment #sysMain h2 .sysRequired {
  display: none;
}

.sysCart#sysPayment #sysMain .sysSelectPaymentArea, .sysCart#sysPayment #sysMain .sysSelectDeliveryArea, .sysCart#sysPayment #sysMain .sysRemarksArea {
  margin-bottom: 30px;
}

.sysCart#sysPayment #sysMain .sysSelectOptionArea {
  margin-bottom: 0;
}

.sysCart#sysPayment #sysMain .sysSelectPaymentArea li label, .sysCart#sysPayment #sysMain .sysSelectDeliveryArea li label {
  padding: 0;
}

.sysCart#sysPayment #sysMain .sysRemarksArea label, .sysCart#sysPayment #sysMain .sysSelectOptionArea label {
  margin-bottom: 5px;
  padding: 0;
}

.sysCart#sysPayment #sysMain textarea {
  margin: 0;
  padding: 8px;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
}

.sysCart#sysConfirm #sysMain .sysOrder, .sysCart#sysConfirm #sysMain .sysProduct {
  margin-bottom: 30px;
}

.sysCart#sysConfirm #sysMain .nav li {
  position: relative;
  padding: 0;
  border-bottom: 0;
}

.sysCart#sysConfirm #sysMain .nav li: not(: last-child) {
  margin-bottom: 30px;
}

.sysCart#sysConfirm #sysMain .nav li .sysConfirmInfo {
  position: relative;
  font-size: 13px;
}

.sysCart#sysConfirm #sysMain .nav li .sysConfirmInfo>div:first-child {
  padding: 0 5px;
  border-bottom: 1px dashed #ccc;
  color: #e83929;
  font-size: 14px;
  font-weight: bold;
  line-height: 30px;
}

.sysCart#sysConfirm #sysMain .nav li .sysConfirmInfo>div: not(:first-child) {
  margin-top: 10px;
}

.sysCart#sysConfirm #sysMain .nav li .sysConfirmButton input[type='submit'] {
  position: absolute;
  top: 0;
  right: 10px;
  width: 9em;
  height: 30px;
  margin: 0;
  background: transparent;
  border: 0;
  font-size: 12px;
  text-align: right;
  text-decoration: underline;
}

.sysCart#sysConfirm #sysMain .nav li .sysConfirmButton input[type='submit']:hover {
  opacity: .8;
}

.sysCart#sysConfirm #sysMain .sysAcceptDomainArea {
  margin-top: 30px;
  padding: 20px;
  border: 1px solid #ccc;
}

.sysCart#sysConfirm #sysMain .sysAcceptDomainArea .sysAcceptDomain:nth-child(2) {
  float: none;
  width: 100%;
  height: auto;
  margin: 10px 0 5px;
}

.sysCart#sysConfirm #sysMain .sysAcceptDomainArea .sysAcceptDomain:nth-child(2) input {
  margin: 0;
}

.sysCart#sysConfirm #sysMain .sysAcceptDomainArea .sysAcceptDomain: not(:nth-child(2)) {
  display: inline;
  float: none;
  width: auto;
  margin: 0;
}

.sysCart#sysConfirm #sysMain .sysAcceptDomainArea .sysAcceptDomain: not(:nth-child(2)) a {
  margin-right: 1em;
  padding: 0;
  font-size: 12px;
  line-height: normal;
}

.sysCart#sysConfirm #sysMain .sysAcceptDomainArea .sysAcceptDomain: not(:nth-child(2)) a:before {
  content: '\003E\00A0';
  font-family: sans-serif;
}

.sysCart#sysDestination #sysMain>div>br {
  display: none;
}

.sysCart#sysDestination #sysMain .sysSelectAddress {
  background: #fff;
  border: 1px solid #ccc;
}

.sysCart#sysDestination #sysMain .sysSelectAddress: not(: last-of-type) {
  margin-bottom: 30px;
}

.sysCart#sysDestination #sysMain .sysSelectAddress .sysSubTitle {
  margin-bottom: 0;
  font-size: 15px;
  font-weight: bold;
}

.sysCart#sysDestination #sysMain .sysSelectAddress .sysSubTitle+div {
  margin-top: 5px;
  padding: 0 10px;
}

.sysCart#sysDestination #sysMain .sysSelectAddress .sysForm.sysOtherAddress {
  margin-top: 10px;
  padding: 0 10px;
}

.sysCart#sysDestination #sysMain .sysSelectAddress .sysForm.sysOtherAddress .sysFormItem {
  padding: 0;
}

.sysCart#sysDestination #sysMain .sysSelectAddress .sysForm.sysOtherAddress .sysFormItem .sysFormField {
  padding: 0;
}

.sysCart#sysDestination #sysMain .sysSelectAddress .sysForm.sysOtherAddress .sysDeliveryAddress label: empty:before {
  content: 'オプション';
}

.sysCart#sysDestination #sysMain .sysSelectAddress .sysForm.sysOtherAddress .sysDeliveryAddress+div {
  margin-top: 20px;
  padding: 0;
}

.sysCart#sysDestination #sysMain .sysSelectAddress .sysForm.sysOtherAddress .sysDeliveryAddress+div .sysNextSubmit {
  position: static;
  margin: 0 auto;
}

@media screen and (min-width: 600px) {
  .sysCart #sysMain .sysBox {
    padding: 15px;
  }
  .sysCart #sysMain .sysBox>a {
    float: left;
    width: 200px;
  }
  .sysCart #sysMain .sysBox .sysProduct, .sysCart #sysMain .sysBox hr+div, .sysCart #sysMain .sysBox .sysSubTotalArea {
    float: right;
    width: calc(100% - 220px);
  }
  .sysCart #sysMain .sysBox .sysProduct {
    padding-right: 20px;
  }
  .sysCart #sysMain .sysBox hr+div {
    padding-right: calc(100% - 620px);
  }
  .sysCart#sysBillingAddress #sysMain button[name='searchAddress'] {
    height: 30px;
  }
  .sysCart#sysConfirm #sysMain .sysBox {
    padding: 15px;
  }
  .sysCart#sysConfirm #sysMain .sysBox>img {
    float: left;
    width: 200px;
  }
  .sysCart#sysDestination #sysMain .sysSelectAddress {
    padding: 15px;
  }
}

@media screen and (max-width: 599px) {
  .sysCart #sysMain .sysBox {
    padding: 10px;
  }
  .sysCart #sysMain .sysBox>a {
    width: calc(100% - 30px);
    margin-bottom: 10px;
  }
  .sysCart #sysMain .sysBox .sysProduct {
    float: none;
    width: auto;
  }
  .sysCart #sysMain .sysBox hr+div:after {
    content: '';
    display: block;
    clear: both;
    height: 0;
  }
  .sysCart #sysMain .sysNavImg {
    width: calc(100% + 20px);
    margin-left: -10px;
  }
  .sysCart #sysMain .sysNavImg img {
    display: none;
  }
  .sysCart #sysMain .sysNavImg:before {
    content: '';
    display: block;
    width: 100%;
    padding-top: 10%;
  }
  .sysCart#sysBillingAddress #sysMain .sysNavImg:before {
    background: url(../img/cart-spnav01.png) no-repeat center / 100% auto;
  }
  .sysCart#sysBillingAddress #sysMain button[name='searchAddress'] {
    height: 44px;
  }
  .sysCart#sysPayment #sysMain .sysNavImg:before {
    background: url(../img/cart-spnav02.png) no-repeat center / 100% auto;
  }
  .sysCart#sysConfirm #sysMain .sysBox {
    padding: 10px;
  }
  .sysCart#sysConfirm #sysMain .sysBox>img {
    float: none;
    width: calc(100% - 30px);
    margin: 0 0 10px;
  }
  .sysCart#sysDestination #sysMain .sysSelectAddress {
    padding: 10px;
  }
}

@media screen and (min-width: 960px) {
  .sysCart #sysMain .sysBox hr+div:before {
    line-height: 30px;
  }
  .sysCart#sysRegi #sysMain .sysBox {
    padding: 20px;
  }
}

@media screen and (max-width: 960px) {
  .sysCart #sysMain .sysBox hr+div:before {
    line-height: 44px;
  }
  .sysCart#sysRegi #sysMain .sysBox {
    padding: 15px;
  }
}

.sysMemberRegister #sysMain {
  position: relative;
}

@media screen and (min-width: 960px) {
  .sysMemberRegister #sysMain {
    padding-bottom: 60px!important;
  }
}

@media screen and (max-width: 959px) {
  .sysMemberRegister #sysMain {
    padding-bottom: 74px!important;
  }
}

.sysMemberRegister #sysMain h2 {
  height: 30px;
  margin-bottom: 20px;
  padding: 0 5px;
  background: transparent;
  border-bottom: 1px solid #333;
  color: #333;
  font: bold 18px/30px 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
}

.sysMemberRegister #sysWrap #sysMain input[type='submit'][value='戻る'], .sysMemberRegister #sysWrap #sysMain input[type='submit'].sysNextSubmit {
  display: block;
  max-width: 400px;
  margin: 0;
  padding: 0;
  border-width: 0;
  border-radius: 3px;
  transition: .3s;
  color: #fff;
  font: normal 13px / normal 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
  text-shadow: none;
  cursor: pointer;
}

.sysMemberRegister #sysWrap #sysMain input[type='submit'][value='戻る']:hover, .sysMemberRegister #sysWrap #sysMain input[type='submit'].sysNextSubmit:hover {
  opacity: .8;
  color: #fff;
}

@media screen and (min-width: 960px) {
  .sysMemberRegister #sysWrap #sysMain input[type='submit'][value='戻る'], .sysMemberRegister #sysWrap #sysMain input[type='submit'].sysNextSubmit {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  .sysMemberRegister #sysWrap #sysMain input[type='submit'][value='戻る'], .sysMemberRegister #sysWrap #sysMain input[type='submit'].sysNextSubmit {
    height: 44px;
  }
}

.sysMemberRegister #sysWrap #sysMain input[type='submit'][value='戻る'] {
  position: absolute;
  bottom: 0;
  left: 0;
  width: calc(50% - 5px);
  background: #607d8b;
}

.sysMemberRegister #sysWrap #sysMain input[type='submit'].sysNextSubmit {
  position: absolute;
  bottom: 0;
  right: 0;
  width: calc(50% - 5px);
  background: #f44336;
}

.sysMemberRegister#sysMemberRegisterConfirm #sysMain h2+div {
  margin-bottom: 20px;
}

.sysMypage #sysMain {
  position: relative;
}

@media screen and (min-width: 960px) {
  .sysMypage #sysMain {
    padding-bottom: 60px!important;
  }
}

@media screen and (max-width: 959px) {
  .sysMypage #sysMain {
    padding-bottom: 74px!important;
  }
}

.sysMypage #sysMain h2 {
  height: 30px;
  margin-bottom: 20px;
  padding: 0 5px;
  background: transparent;
  border-bottom: 1px solid #333;
  color: #333;
  font: bold 18px/30px 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
}

.sysMypage #sysMain input[type='submit'].sysBackButton, .sysMypage #sysMain input[type='submit'][value='戻る'], .sysMypage #sysMain input[type='submit'].sysNextSubmit, .sysMypage #sysMain input[type='submit'].sysLoginButton, .sysMypage #sysMain input[type='submit'][value='退会しない'], .sysMypage #sysMain input[type='submit'][value='退会する'], .sysMypage #sysMain input[type='submit'][value='確認メールを受け取る'] {
  display: block;
  max-width: 400px;
  margin: 0;
  padding: 0;
  border-width: 0;
  border-radius: 3px;
  transition: .3s;
  color: #fff;
  font: normal 13px / normal 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
  text-shadow: none;
  cursor: pointer;
}

.sysMypage #sysMain input[type='submit'].sysBackButton:hover, .sysMypage #sysMain input[type='submit'][value='戻る']:hover, .sysMypage #sysMain input[type='submit'].sysNextSubmit:hover, .sysMypage #sysMain input[type='submit'].sysLoginButton:hover, .sysMypage #sysMain input[type='submit'][value='退会しない']:hover, .sysMypage #sysMain input[type='submit'][value='退会する']:hover, ..sysRemindForm input[type='submit'][value='確認メールを受け取る']:hover {
  opacity: .8;
  color: #fff;
}

@media screen and (min-width: 960px) {
  .sysMypage #sysMain input[type='submit'].sysBackButton, .sysMypage #sysMain input[type='submit'][value='戻る'], .sysMypage #sysMain input[type='submit'].sysNextSubmit, .sysMypage #sysMain input[type='submit'].sysLoginButton, .sysMypage #sysMain input[type='submit'][value='退会しない'], .sysMypage #sysMain input[type='submit'][value='退会する'], .sysMypage #sysMain input[type='submit'][value='確認メールを受け取る'] {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  .sysMypage #sysMain input[type='submit'].sysBackButton, .sysMypage #sysMain input[type='submit'][value='戻る'], .sysMypage #sysMain input[type='submit'].sysNextSubmit, .sysMypage #sysMain input[type='submit'].sysLoginButton, .sysMypage #sysMain input[type='submit'][value='退会しない'], .sysMypage #sysMain input[type='submit'][value='退会する'], .sysMypage #sysMain input[type='submit'][value='確認メールを受け取る'] {
    height: 44px;
  }
}

.sysMypage #sysMain input[type='submit'].sysBackButton, .sysMypage #sysMain input[type='submit'][value='戻る'], .sysMypage #sysMain input[type='submit'][value='退会しない'] {
  position: absolute;
  bottom: 0;
  left: 0;
  width: calc(50% - 5px);
  background: #607d8b;
}

.sysMypage #sysMain input[type='submit'].sysNextSubmit, .sysMypage #sysMain input[type='submit'].sysLoginButton, .sysMypage #sysMain input[type='submit'][value='退会する'], .sysMypage #sysMain input[type='submit'][value='確認メールを受け取る'] {
  position: absolute;
  bottom: 0;
  right: 0;
  width: calc(50% - 5px);
  background: #f44336;
}

.sysMypage #sysMain h2+h3 {
  position: absolute;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 30px;
  margin-bottom: 20px;
  padding: 0 5px;
  background: #fff;
  border-bottom: 1px solid #333;
  color: #333;
  font: bold 18px/30px 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
}

.sysMypage #sysMain .sysMypageNav {
  margin: 20px 0 0 -2.5px;
}

.sysMypage #sysMain .sysMypageNav:after {
  content: '';
  display: block;
  clear: both;
  height: 0;
}

.sysMypage #sysMain .sysMypageNav form {}

.sysMypage #sysMain .sysMypageNav form input[type='submit'] {
  display: block;
  height: 44px;
  margin: 2.5px;
  padding: 0 7.5px;
  background: transparent;
  border: 1px solid #ccc;
  border-radius: 3px;
  color: #333;
  font-size: 12px;
  line-height: normal;
  text-align: left;
  cursor: pointer;
}

.sysMypage #sysMain .sysMypageNav form input[type='submit']:hover {
  opacity: .8;
}

.sysMypage#sysMypageLogin #sysMain {
  padding-bottom: 0;
}

.sysMypage#sysMypageLogin #sysMain .sysMypageMinorHeadLine, .sysMypage#sysMypageLogin #sysMain .sysLoginForm {
  max-width: 400px;
  margin: 0 auto;
}

.sysMypage#sysMypageLogin #sysMain .sysLoginForm .sysFormItem {
  margin-top: 10px;
}

.sysMypage#sysMypageLogin #sysMain .sysLoginForm .sysFormItem .sysFormLabel {
  display: inline-block;
  margin-bottom: 5px;
  font-size: 13px;
}

.sysMypage#sysMypageLogin #sysMain .sysLoginForm .sysLoginButton {
  position: static;
  width: 100%;
  margin: 15px 0 0;
}

.sysMypage#sysMypageLogin #sysMain .sysLoginForm input[value='会員ID・パスワードを忘れた場合'] {
  display: block;
  width: 100%;
  margin-top: 5px;
  background: transparent;
  border: 0;
  font-size: 12px;
  line-height: 20px;
  text-align: right;
  cursor: pointer;
}

.sysMypage#sysMypageLogin #sysMain .sysLoginForm input[value='会員ID・パスワードを忘れた場合']:hover {
  text-decoration: underline;
}

.sysMypage#sysMypageReminder #sysMain {
  padding-bottom: 0;
}

.sysMypage#sysMypageReminder #sysMain .sysRemindForm {
  max-width: 400px;
  margin: 0 auto;
}

.sysMypage#sysMypageReminder #sysMain .sysRemindForm input[value='確認メールを受け取る'] {
  position: static;
  width: 100%;
  margin-top: 10px;
}

.sysMypage#sysMypageIndex #sysMain {
  padding-bottom: 0;
}

.sysMypage#sysMypageIndex #sysMain .sysPagination li {
  width: 44px;
  padding: 0;
}

.sysMypage#sysMypageIndex #sysMain .sysPagination li a {
  border: 1px solid #ccc;
  border-radius: 50%;
  background: #fff;
  text-decoration: none;
}

.sysMypage#sysMypageIndex #sysMain .sysPagination li a:hover, .sysMypage#sysMypageIndex #sysMain .sysPagination li a.sysCurrent {
  background: #eee;
}

.sysMypage#sysMypageEditConfirm #sysMain h3+div {
  margin-bottom: 15px;
  opacity: .8;
  font-size: 13px;
}

.sysMypage#sysMypageEditConfirm #sysMain .sysForm .sysFormItem .sysFormLabel::first-letter {
  font-size: 0;
}

.sysMypage#sysMypageEditConfirm #sysMain .sysForm .sysFormItem .sysFormField {
  margin-left: 10px;
  font-size: 13px;
}

.sysMypage#sysMypageEditDelivery #sysMain form[action='edit-delivery.html?action_front_mypage_edit_deliveryinput'] {
  margin-bottom: 30px;
}

.sysMypage#sysMypageEditDelivery #sysMain form[action='edit-delivery.html?action_front_mypage_edit_deliveryinput'] button {
  padding: 10px;
  font-size: 12px;
  cursor: pointer;
}

.sysMypage#sysMypageEditDelivery #sysMain form[action='edit-delivery.html?action_front_mypage_edit_deliveryinput'] button:hover {
  background: #f4f4f4;
}

.sysMypage#sysMypageEditDelivery #sysMain form[action='edit-savedelivery.html']>.sysErrorMessage.errorMessage {
  display: none;
}

.sysMypage#sysMypageEditDelivery #sysMain form[action='edit-savedelivery.html'] .sysOtherAddress {
  margin-top: 20px;
}

.sysMypage#sysMypageAshiato #sysMain {
  padding-bottom: 0;
}

.sysMypage#sysMypageAshiato #sysMain .sysItemList li .sysThumbnailImage+div {
  font-size: 13px;
}

.sysMypage#sysMypageAshiato #sysMain .sysItemList li .sysThumbnailImage+div a {
  color: #333;
  font-weight: bold;
}

.sysMypage#sysMypageAshiato #sysMain .sysItemList li .sysCartButton {
  height: 0;
  margin-top: 5px;
  padding-top: 28%;
}

@media screen and (min-width: 960px) {
  .sysMypage #sysMain .sysMypageNav form {}
  .sysMypage#sysMypageLogin #sysMain .sysLoginButton {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  .sysMypage#sysMypageLogin #sysMain .sysLoginButton {
    height: 44px;
  }
}

@media screen and (max-width: 959px) and (min-width: 600px) {
  .sysMypage #sysMain .sysMypageNav form {}
}

@media screen and (max-width: 599px) {
  .sysMypage #sysMain .sysMypageNav form {}
}

.sysItemReview #sysMain {
  position: relative;
}

@media screen and (min-width: 960px) {
  .sysItemReview #sysMain {
    padding-bottom: 60px!important;
  }
}

@media screen and (max-width: 959px) {
  .sysItemReview #sysMain {
    padding-bottom: 74px!important;
  }
}

.sysItemReview #sysMain h2 {
  height: 30px;
  margin-bottom: 20px;
  padding: 0 5px;
  background: transparent;
  border-bottom: 1px solid #333;
  color: #333;
  font: bold 18px/30px 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
}

.sysItemReview #sysMain input[type='submit'][value='商品詳細'], .sysItemReview #sysMain input[type='submit'][value='確認画面に進む'], .sysItemReview #sysMain input[type='submit'][value='入力画面に戻る'], .sysItemReview #sysMain input[type='submit'][value='投稿する'], .sysItemReview #sysMain input[type='submit'][value='戻る'] {
  display: block;
  max-width: 400px;
  margin: 0;
  padding: 0;
  border-width: 0;
  border-radius: 3px;
  transition: .3s;
  color: #fff;
  font: normal 13px / normal 'Noto Sans Japanese', '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, sans-serif;
  text-shadow: none;
  cursor: pointer;
}

.sysItemReview #sysMain input[type='submit'][value='商品詳細']:hover, .sysItemReview #sysMain input[type='submit'][value='確認画面に進む']:hover, .sysItemReview #sysMain input[type='submit'][value='入力画面に戻る']:hover, .sysItemReview #sysMain input[type='submit'][value='投稿する']:hover, .sysItemReview #sysMain input[type='submit'][value='戻る']:hover {
  opacity: .8;
  color: #fff;
}

@media screen and (min-width: 960px) {
  .sysItemReview #sysMain input[type='submit'][value='商品詳細'], .sysItemReview #sysMain input[type='submit'][value='確認画面に進む'], .sysItemReview #sysMain input[type='submit'][value='入力画面に戻る'], .sysItemReview #sysMain input[type='submit'][value='投稿する'], .sysItemReview #sysMain input[type='submit'][value='戻る'] {
    height: 30px;
  }
}

@media screen and (max-width: 959px) {
  .sysItemReview #sysMain input[type='submit'][value='商品詳細'], .sysItemReview #sysMain input[type='submit'][value='確認画面に進む'], .sysItemReview #sysMain input[type='submit'][value='入力画面に戻る'], .sysItemReview #sysMain input[type='submit'][value='投稿する'], .sysItemReview #sysMain input[type='submit'][value='戻る'] {
    height: 44px;
  }
}

.sysItemReview #sysMain input[type='submit'][value='商品詳細'], .sysItemReview #sysMain input[type='submit'][value='入力画面に戻る'], .sysItemReview #sysMain input[type='submit'][value='戻る'] {
  position: absolute;
  bottom: 0;
  left: 0;
  width: calc(50% - 5px);
  background: #607d8b;
}

.sysItemReview #sysMain input[type='submit'][value='確認画面に進む'], .sysItemReview #sysMain input[type='submit'][value='投稿する'] {
  position: absolute;
  bottom: 0;
  right: 0;
  width: calc(50% - 5px);
  background: #f44336;
}

.sysItemReview #sysMain h2+div {
  text-align: center;
}

.sysItemReview #sysMain h2+div img {
  max-width: 300px;
  padding: 10px;
  border: 1px solid #ccc;
}

.sysItemReview #sysMain h3 {
  margin: 30px 0 10px;
  font-size: 16px;
  text-decoration: underline;
}

.sysItemReview#sysItemReviewIndex #sysMain .sysForm .sysFormItem.sysEvaluation .sysFormField label {
  margin-left: 0;
}

.header_img {
  width: 100%;
  height: auto;
  background-color: rgb(224, 224, 224);
}

.header_img img {
  display: block;
  width: 960px;
  margin: 0 auto;
}

p.payment {
  display: inline-block;
}

p.payment img {
  width: 50%;
}

#sysItemDetail #sysMain .sysCategoryPankuzu {
  color: #666;
  font: 100 12px 'Oswald', sans-serif;
}

#sysItemDetail #sysMain .sysCategoryPankuzu span: empty, #sysItemDetail #sysMain .sysCategoryPankuzu span: empty+br {
  display: none;
}

#sysItemDetail #sysMain .sysCategoryPankuzu a {
  color: #fff;
  font: 12px 'Noto Sans Japanese', '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック体 Medium', 'YuGothic', '游ゴシック Medium', 'Yu Gothic', '游ゴシック体', 'YuGothic', 'YuGothic M', 'メイリオ', 'Meiryo', 'Osaka', serif;
}

#sysItemDetail #sysMain .iteminfo, #sysItemDetail #sysMain .itemimg {
  margin-top: 30px;
}

#sysItemDetail #sysMain .iteminfo {
  position: relative;
  padding-top: 30px;
}

#sysItemDetail #sysMain .iteminfo .sysItemPr {
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  padding: 0 6px;
  background: #062367;
  color: #fff;
  font-size: 11px;
  line-height: 20px;
}

#sysItemDetail #sysMain .iteminfo .sysDescription {
  color: #444;
  font-size: 13px;
}

#sysItemDetail #sysMain .iteminfo .sysItemName h1 {
  font-size: 20px;
  font-weight: bold;
  line-height: 1;
}

#sysItemDetail #sysMain .iteminfo .sysItemId {
  margin: 5px 0;
  color: #999;
  font-size: 12px;
}

#sysItemDetail #sysMain .iteminfo .sysRetailPrice {
  color: #ff0000;
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: bold;
}

#sysItemDetail #sysMain .iteminfo .sysExplanation table {
  width: 100%;
}

#sysItemDetail #sysMain .iteminfo .sysExplanation th, #sysItemDetail #sysMain .iteminfo .sysExplanation td {
  padding: 5px 10px;
  border: 1px solid #ccc;
  font-size: 13px;
}

#sysItemDetail #sysMain .iteminfo .sysExplanation th {
  width: calc(4em + 22px);
  background: #f4f4f4;
  color: #444;
  font-weight: bold;
}

#sysItemDetail #sysMain .iteminfo .sysForm {
  margin-top: 20px;
}

#sysItemDetail #sysMain .iteminfo .sysForm .sysNumArea .aiBtn {
  float: left;
  width: calc(50% - 2.5px);
  margin: 5px 0;
}

#sysItemDetail #sysMain .iteminfo .sysForm .sysNumArea .aiBtnPlus {
  margin-right: 5px;
}

#sysItemDetail #sysMain .iteminfo .sysForm .sysSubmit {
  clear: both;
}

#sysItemDetail #sysMain .iteminfo .sysForm .aiBtnFav {
  position: absolute;
  top: 0;
  right: 0;
  width: auto;
  height: 20px;
  padding: 0 10px;
  font-size: 12px;
  line-height: 20px;
}

#sysItemDetail #sysMain .iteminfo .sysForm .aiBtnFav[disabled] {
  background: #999;
}

#sysItemDetail #sysMain .itemimg .sysMainImage {
  border: 1px solid #ccc;
}

#sysItemDetail #sysMain .itemimg .sysMainImage img {
  width: 100%;
}

#sysItemDetail #sysMain .itemimg .sysImageList li {
  width: calc(25% - 7.5px);
  height: auto;
  margin: 10px 0 0;
  line-height: normal;
}

#sysItemDetail #sysMain .itemimg .sysImageList li: not(:nth-child(4n)) {
  margin-right: 10px;
}

#sysItemDetail #sysMain .itemimg .sysImageList li img {
  border: 3px solid #ccc;
}

#sysItemDetail #sysMain .itemimg .sysImageList li img:hover, #sysItemDetail #sysMain .itemimg .sysImageList .sysCurrent img {
  border-color: #666;
}



.sysFuncItemSearch .aiContent {
  margin-top: 10px;
}

table.cash_on {
  display: block;
  width: 100%;
  margin: 0;
}

table.cash_on caption {
  display: block;
  height: 30px;
  font-weight: bold;
  line-height: 30px;
  padding-left: 5px;
  text-align: left;
  background-color: #062367;
  color: #fff;
}

table.cash_on tbody {
  display: block;
  width: calc(100%-10px);
  margin: 10px 5px;
}

table.cash_on tr {
  display: block;
  width: 100%;
  height: 30px;
}

table.cash_on th {
  font-weight: bold;
  width: 335px;
  height: 30px;
}

table.cash_on td {
  width: 50%;
  width: 335px;
  height: 30px;
}

table.postage {
  width: 100%;
  background-color: #d4d7dc;
  margin: 10px 0;
}

table.postage tbody {
  display: block;
  width: 100%;
}

table.postage tr.postage_ttl {
  width: 100%;
  height: 30px;
  font-weight: bold;
  line-height: 30px;
  padding-left: 5px;
  text-align: left;
  background-color: #062367;
  color: #fff;
}

table.postage tr {
  width: 100%;
  height: 50px;
  border-bottom: solid 1px #fff;
}

table.postage th {
  font-weight: bold;
  width: auto;
  height: 50px;
  text-align: center;
  padding: 10px 5px;
}

table.postage td {
  width: calc(100%/3);
  height: 50px;
  border-right: solid 0px #fff;
  padding: 10px 5px;
  vertical-align: middle;
}

table.postage td.fee {
  text-align: center;
}

.aiBtn, .sysButton.sysBackSubmitArea {
  display: block;
  width: 100%;
  background: #666;
  border: 0;
  border-radius: 3px;
  transition: background .3s, border .3s, color .3s;
  color: #fff;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}

.aiBtn.aiBtnMore, .aiBtn.aiBtnIn, .aiBtn.aiBtnGo {
  background: #062367;
}

.aiBtn.aiBtnSearch, .aiBtn.aiBtnOrder, .aiBtn.aiBtnLogin, .aiBtn.aiBtnNext, .aiBtn.aiBtnMypage, .sysRemindForm input[type='submit'], input.sysBtnChange {
  background: #062367;
  color: #fff;
  margin-top: 10px;
}

input.sysBtnChange {
  width: 49.5%;
}

.aiBtn.aiBtnPlus, .aiBtn.aiBtnMinus {
  border: 1px solid #062367;
  background: #fff;
  color: #062367;
}

.aiBtn.aiBtnMore {
  position: relative;
}

.aiBtn.aiBtnMore:after {
  content: '\003e';
  position: absolute;
  top: 50%;
  right: 10px;
  margin-top: -8px;
  color: #fff;
  font: 100 14px/14px 'Oswald', sans-serif;
}

.aiBtn.aiBtnIn[disabled], .aiBtn.aiBtnIn[disabled]:hover {
  background: #ccc;
}

input.aiBtn.aiBtnNext, input.aiBtn.aiBtnBack {
  width: 100%;
  margin: 10px auto;
}

@media screen and (min-width: 960px) {
  .aiBtn, .sysButton.sysBackSubmitArea {
    height: 30px;
    font-size: 13px;
    line-height: 30px;
    margin: 10px 0px 10px 0px;
  }
  .aiBtn:hover, .sysButton.sysBackSubmitArea:hover {
    background: #999;
    color: #fff;
  }
  .aiBtn.aiBtnMore:hover, .aiBtn.aiBtnIn:hover, .aiBtn.aiBtnGo:hover {
    background: #344c84;
  }
  .aiBtn.aiBtnSearch:hover, .aiBtn.aiBtnOrder:hover, .aiBtn.aiBtnLogin:hover, .aiBtn.aiBtnNext:hover, .aiBtn.aiBtnMypage:hover, .sysRemindForm input[type='submit']:hover, input.sysBtnChange:hover {
    background: #344c84;
  }
  .aiBtn.aiBtnPlus:hover, .aiBtn.aiBtnMinus:hover {
    background: #062367;
    color: #fff;
  }
}

@media screen and (max-width: 959px) {
  .aiBtn {
    height: 44px;
    font-size: 14px;
    line-height: 44px;
  }
}

.aiPageCart #sysMain {
  position: relative;
}

.aiPageCart #sysMain .sysNavImg {
  margin-bottom: 30px;
}

.aiPageCart #sysMain .aiBtnDelete, #sysDestination #sysMain .delete {
  position: absolute;
  top: 5px;
  right: 5px;
  background: transparent url(../img/menu-btn-close.png) no-repeat center center/100%;
  border: 0;
  font-size: 0!important;
  cursor: pointer;
}

#sysBasket #sysMain .sysNextSubmitArea, #sysBillingAddress #sysMain .sysNextSubmitArea, #sysPayment #sysMain .sysNextSubmitArea, #sysConfirm #sysMain>.sysNextSubmitArea, .aiPageCart #sysMain .sysBackSubmitArea {
  position: absolute;
  bottom: 0;
  width: calc(50% - 5px);
}

#sysBillingAddress #sysMain .sysNextSubmitArea, #sysPayment #sysMain .sysNextSubmitArea, #sysConfirm #sysMain>.sysNextSubmitArea, #sysBasket #sysMain>.dammy {
  right: 0;
}

#sysBasket #sysMain .sysNextSubmitArea {
  right: 0;
  padding: 40px;
}

.aiPageCart #sysMain .sysBackSubmitArea {
  left: 0;
}

@media screen and (min-width: 960px) {
  .aiPageCart #sysMain .aiBtnDelete, #sysDestination #sysMain .delete {
    width: 30px;
    height: 30px
  }
  .aiPageCart #sysWrap #sysMain {
    padding-bottom: 60px;
  }
}

@media screen and (max-width: 959px) {
  .aiPageCart #sysMain .aiBtnDelete, #sysDestination #sysMain .delete {
    width: 44px;
    height: 44px
  }
  .aiPageCart #sysWrap #sysMain {
    padding-bottom: 64px;
  }
}

@media screen and (max-width: 599px) {
  .aiPageCart #sysMain .sysNavImg {
    width: calc(100% + 20px);
    margin-left: -10px;
  }
  .aiPageCart #sysMain .sysNavImg img {
    display: none;
  }
  .aiPageCart #sysMain .sysNavImg:before {
    content: '';
    display: block;
    width: 100%;
    padding-top: 10%;
  }
}

#sysBasket #sysMain {
  padding-top: 45px;
}

#sysBasket #sysMain .sysNextSubmitArea: first-of-type {
  display: none;
}

#sysBasket #sysMain .sysTotal .sysBox {
  margin: 0;
  padding: 15px;
  font-size: 16px;
}

#sysBasket #sysMain .sysTotal .sysTotalTxt {
  text-shadow: none;
}

#sysBasket #sysMain .sysItemListArea .sysCartTitle {
  position: absolute;
  top: 0px;
  width: 100%;
  height: 48px;
  padding: 10px 5px;
  border-bottom: 1px solid #000;
  font-size: 24px;
}

#sysBasket #sysMain .sysItemListArea .sysCartTitle+.sysBox {
  margin-top: 20px;
}

#sysBasket #sysMain .sysItemListArea li {
  position: relative;
  min-height: 100px;
  margin-top: 20px;
  border: solid 1px #333;
}

#sysBasket #sysMain .sysBox>a {
  display: block;
  overflow: hidden;
}

#sysBasket #sysMain .sysBox>a img {
  width: 100%;
  margin: 0;
}

#sysBasket #sysMain .sysBox hr {
  display: none;
}

#sysBasket #sysMain .sysBox hr+div {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #dedede;
}

#sysBasket #sysMain .sysBox hr+div select {
  display: inline;
  width: auto;
  margin: 0;
}

#sysBasket #sysMain .sysBox hr+div div, #sysBasket #sysMain .sysBox .sysNumArea button {
  float: left;
}

#sysBasket #sysMain .sysBox .sysNumArea button {
  width: 150px;
  margin: 0 0 0 10px;
}

#sysBasket #sysMain .sysBox .sysSubTotalArea {
  clear: both;
  padding-top: 15px;
}

.sysTotal {
  margin-top: 20px;
}

@media screen and (max-width: 959px) {
  #sysBasket #sysMain {
    padding-top: 50px;
  }
}

@media screen and (min-width: 600px) {
  #sysBasket #sysMain .sysItemListArea li {
    padding: 20px 20px 20px 140px;
  }
  #sysBasket #sysMain .sysBox>a {
    position: absolute;
    top: 20px;
    left: 20px;
    width: 100px;
    height: 100px;
  }
}

@media screen and (max-width: 599px) {
  #sysBasket #sysMain .sysItemListArea li {
    padding: 15px;
  }
  #sysBasket #sysMain .sysBox>a {
    max-width: calc(100% - 44px);
    margin-bottom: 10px;
  }
  #sysBasket #sysMain .sysBox .sysNumArea {
    width: 100%;
    margin-top: 5px;
  }
  #sysBasket #sysMain .sysBox .sysNumArea button {
    width: calc(50% - 2.5px);
    min-width: 0;
    margin-left: 5px;
  }
  #sysBasket #sysMain .sysBox .sysNumArea button:first-child {
    margin-left: 0;
  }
}

#sysMain .sysList li>form {
  width: calc(100% - 130px);
  max-width: 150px;
  margin-top: 5px;
  height: 30px;
  float: left;
}

#sysAll .sysBox {
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#sysMain .sysFuncItemBlock li {
  float: left;
}

.sysFuncItemBlock.topNewitem {
  width: 100%;
  height: 300px;
}

.topNewitem .aiContent {
  width: 100%;
  height: 300px;
  margin-top: 10px;
}

.sysFuncItemBlock.topPickup_item {
  width: 100%;
  height: 300px;
}

.topPickup_item .aiContent {
  width: 100%;
  height: 300px;
  margin-top: 10px;
}

#sysPurchaseAuthMember, #sysRegisterForm, #sysPurchaseAuthCustomer {
  margin-bottom: 50px;
}

#sysPurchaseAuthMember .sysCartTitle, #sysRegisterForm .sysCartTitle, #sysPurchaseAuthCustomer .sysCartTitle {
  background-color: #fff;
  color: #000;
  padding: 0;
  font-size: medium;
  border-bottom: solid 1px #000;
}

.sysMypageNav form {
  margin: 10px 0;
}

.sysLoginForm input {
  margin: 10px 0;
}

h2.sysMypageMajorHeadLine {
  font: 24px bold;
  border-bottom: 1px solid #000;
  margin-bottom: 20px;
}

#sysMypageLogin #sysMain .sysMypageMinorHeadLine {
  display: none;
}

.sysFuncMemberLogin.sideLogin .aiContent div: last-child {
  font-size: 0;
}

.sysFuncMemberLogin.sideLogin .aiContent a.aiBtn {
  margin-top: 10px;
}

ul.sctl li {
  margin-bottom: 20px;
}

ul.sctl li:before {
  content: '';
  width: 6px;
  height: 6px;
  display: inline-block;
  border-radius: 100%;
  background: #ff907d;
  position: relative;
  left: -15px;
  top: -3px;
}

.sctl_space01 {
  margin-right: 1em;
}

.sctl_space02 {
  margin-right: 2em;
}

#slide {
  max-width: 960px;
  min-height: 0px;
  margin: 0 auto;
  position: relative;
}

#slide img {
  position: absolute;
  left: 0;
  top: 0;
}

#slide li {
  width: 100%!important;
  height: 0!important;
  padding-top: 36.9792%!important;
}

#slide ul {
  padding-top: 36.9792%;
}

.sysFuncItemBlock.sideBlockranking .aiContent {
  margin-top: 20px;
}

.sysFuncItemBlock.sideBlockranking ul {
  border: solid 1px #062367;
}

.sysFuncItemBlock.sideBlockranking ul li {
  border-bottom: solid 1px #062367;
}

.sysFuncItemBlock.sideBlockranking ul li: last-child {
  border-bottom: none;
}

.sysFuncItemBlock.sideBlockranking .sysItemImage {
  width: 95%;
  margin: 5px auto;
}

.sysFuncItemBlock.sideBlockranking .sysItemName {
  margin: 5px;
}

.sideQR table {
  margin-top: 10px;
  border: solid 1px #00f;
}

.sideQR table td {
  padding: 10px 10px 10px 15px;
  font-size: 18px;
  line-height: 1.2em;
  letter-spacing: 2px;
}

.e_zine img {
  width: 100%;
}

.sideStoreitd table {
  border: solid 1px #00f;
  margin-top: 20px;
}

.sideStoreitd table img {
  width: 100%;
}

.sideStoreitd table td p {
  padding: 10px 5px 10px 5px;
  font-size: 18px;
  line-height: 1.2em;
  letter-spacing: 2px;
}

.sysFuncText.topText, .sysFuncText.topSelect, .sysFuncText.topSelectsp, .sysFuncText.topRecommend, .sysFuncText.topAccessories, .sysFuncItemBlock.topRVI, .sysFuncText.topVideo, .sysFuncItemBlock.topRecommended_p, .sysFuncBanner.topBanner {
  float: left;
}

.sysFuncText.topText .aiContent {
  margin-top: 20px;
  background-color: #E1FDFC;
  border: 1px dashed #00F;
}

.sysFuncText.topText .aiContent p {
  margin: 10px;
}

.sysFuncText.topSelect {
  width: 100%;
}

.sysFuncText.topSelect img {
  width: 100%;
}

.topSelect .aiContent {
  margin-top: 20px;
}

.sysFuncText.topSelectsp {
  display: none;
}

@media screen and (max-width: 599px) {
  .sysFuncText.topSelect {
    display: none;
  }
  .sysFuncText.topSelectsp {
    display: block;
    width: 100%;
  }
}

.topSelectsp .aiContent {
  margin-top: 20px;
}

.topSelectsp .select01, .topSelectsp .select02, .topSelectsp .select03, .topSelectsp .select04, .topSelectsp .select05, .topSelectsp .select06 {
  width: 100%;
  height: auto;
  border-bottom: 1px dotted #333;
  padding-bottom: 20px;
  margin-top: 20px;
  overflow: hidden;
}

.select_sp_img, .select_sp_txt {
  width: 100%;
}

.select_sp_txt li {
  height: 44px;
}

.select_sp_l li: not(: last-child) {
  margin-bottom: 10px;
}

.select_sp_txt li a {
  display: block;
  position: relative;
  width: 100%;
  height: 44px;
}

.select_sp_txt li a span {
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  text-decoration: underline;
  line-height: 20px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}

.select01 h3 {
  border-left: solid 8px #fff001;
  padding: 0 0 0 10px;
  margin-bottom: 10px;
}

.select02 h3 {
  border-left: solid 8px #01913a;
  padding: 0 0 0 10px;
  margin-bottom: 10px;
}

.select03 h3 {
  border-left: solid 8px #e50112;
  padding: 0 0 0 10px;
  margin-bottom: 10px;
}

.select04 h3 {
  border-left: solid 8px #f29702;
  padding: 0 0 0 10px;
  margin-bottom: 10px;
}

.select05 h3 {
  border-left: solid 8px #019fe8;
  padding: 0 0 0 10px;
  margin-bottom: 10px;
}

.topSelectsp .select06 {
  border: none;
}

.select06 h3 {
  border-left: solid 8px #e2007e;
  padding: 0 0 0 10px;
  margin-bottom: 10px;
}


}
.sysFuncItemBlock.topRVI {
  width: 100%;
}
.topRVI h2 {
  font-size: 2rem;
  margin-bottom: 15px;
  text-align: center;
  border-bottom: 1px solid #333;
}

}
.sysFuncText.topRecommend .aiContent {
  margin-top: 20px;
}
.sysFuncText.topRecommend .aiContent p {
  margin-bottom: 10px;
}
.sysFuncText.topAccessories {
  width: 100%;
}
.recommend_bnr {
  line-height: 10px;
  -webkit-column-count: 2;
  -webkit-column-gap: 10px;
  -moz-column-count: 2;
  -moz-column-gap: 10px;
  column-count: 2;
  column-gap: 10px;
}
.recommend_bnr img {
  width: 100%;
  height: auto;
  margin-top: 10px;
}
.accessories_bnr {
  line-height: 0;
  -webkit-column-count: 4;
  -webkit-column-gap: 10px;
  -moz-column-count: 4;
  -moz-column-gap: 10px;
  column-count: 4;
  column-gap: 10px;
}
.accessories_bnr img {
  width: 100%;
  height: auto;
  margin-top: 10px;
}
@media screen and (max-width: 599px) {
  .recommend_bnr {
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
  }
  .accessories_bnr {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
  }
}
.topVideo .aiContent {
  margin-top: 20px;
}
p {
  margin: 0;
  padding: 0;
  font-size: 14px;
}
img {
  border: 0;
}
.topVideo ul {
  width: 100%;
  border-top: solid 1px #00f;
  border-right: solid 1px #00f;
  overflow: hidden;
}
li.movie_product_1 {
  width: 25%;
  text-align: center;
  height: 175px;
  float: left;
  border-bottom: solid 1px #00f;
  border-left: solid 1px #00f;
  padding-top: 5px;
}
li.movie_product_1: last-child {
  border-right: none;
}
li.movie_product_1 p {
  width: 100%;
  height: auto;
}
@media screen and (max-width: 599px) {
  li.movie_product_1 {
    width: 50%;
  }
  li.movie_product_1 p a img {
    width: 40vw;
  }
}
.sysFuncBanner.topBanner img {
  margin-bottom: 10px;
}
.mainCompany .aiContent h2 {
  border-bottom: solid 1px #000;
}
.company {
  width: 100%;
  height: auto;
  margin-bottom: 40px;
  overflow: hidden;
}
.company_img {
  text-align: center;
  width: 45%;
  float: left;
}
.company_img img {
  width: 100%;
}
.company_txt {
  float: right;
  width: 50%;
}
.company_txt p {
  padding: 5px 0;
}
.maint_l, .detailing_l, .chemical_l {
  float: left;
  width: 60%;
  margin-top: 20px;
}
.maint_l p, .detailing_l p, .chemical_l p {
  margin: 20px 0;
}
.maint_r, .detailing_r, .chemical_r {
  float: right;
  margin-top: 20px;
  width: 40%;
}
.maint_r .img_cp {
  margin: 0 20px;
  padding: 110px 0;
}
.detailing_r .img_cp {
  margin: 0 20px;
  padding: 30px 0;
}
.chemical_r .img_cp {
  margin: 0 20px;
  padding: 30px 0;
}
@media screen and (max-width: 599px) {
  .company_img, .company_txt {
    width: 100%;
    float: none;
  }
  .maint_l, .detailing_l, .chemical_l {
    float: none;
    width: 100%;
    margin-top: 20px;
  }
  .maint_r, .detailing_r, .chemical_r {
    float: none;
    margin-top: 20px;
    width: 100%;
  }
  .maint_r .img_cp, .detailing_r .img_cp, .chemical_r .img_cp {
    width: 100%;
    margin: 20px auto;
    padding: 0;
    overflow: hidden;
  }
  .img_cp img {
    width: 50%;
    float: left;
  }
  .img_cp p {
    width: 45%;
    float: right;
  }
}
.sysItemCategoryInfo {
  display: block;
  overflow: hidden;
}
.sysCategoryDescription h1 {
  border-left: solid 20px #00f;
  border-bottom: solid 2px #00f;
  font-weight: bold;
  font-size: 21px;
  color: #FFF;
  background-color: #09F;
}
.sysCategoryDescription h2 {
  border-bottom: 1px solid #333;
  font-size: 16px;
  font-weight: normal;
}
.sysCategoryDescription h3 {
  position: relative;
  color: #111;
  font-size: 1.143em;
  font-weight: bold;
  margin: 20px 10px 0 10px;
  padding: .5em .5em .5em 1.7em;
  border-bottom: 3px solid #2762AA;
}
.sysCategoryDescription h3:before {
  content: "";
  position: absolute;
  background: #d48789;
  top: 0;
  left: .4em;
  height: 12px;
  width: 12px;
  transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
}
.sysCategoryDescription h3:after {
  content: "";
  position: absolute;
  background: #d26466;
  top: 1.0em;
  left: 0;
  height: 8px;
  width: 8px;
  transform: rotate(15deg);
  -moz-transform: rotate(15deg);
  -o-transform: rotate(15deg);
  -ms-transform: rotate(15deg);
}
img.category_img {
  float: left;
  width: 48%;
  margin: 5px;
}
img.ct590_img {
  width: 100%;
}
.sysCategoryDescription p {
  margin: 10px;
}
.sysCategoryDescription ul {
  margin: 10px;
}
@media screen and (max-width: 599px) {
  img.category_img {
    float: none;
    width: 100%;
    margin: 0 0 5px 0;
  }
}
.sysItemCategoryCtl a {
  display: inline-block;
  padding: 2px 4px;
  background: #ddd;
  border: 1px solid #999;
  border-radius: 3px;
  text-decoration: none;
  margin: 2px 0;
}
.sysItemCategoryCtl a:hover {
  background: #e3eafb;
}
@media screen and (max-width: 599px) {
  .sysItemCategoryCtl a.hover {
    background: #e3eafb;
  }
}
div#sysExplanation {
  width: 100%!important;
  overflow: hidden;
}
#sysExplanation table {
  width: 100%;
}
#sysExplanation embed {
  width: 100%;
}
#sysExplanation p, #sysExplanation li {
  margin: 10px;
}
.sysFuncItemBlock.itemRecommended_p {
  margin-top: 60px;
}
.mainIndependence h1 {
  border-left: solid 20px #00f;
  border-bottom: solid 2px #00f;
  font-weight: bold;
  font-size: 21px;
  color: #FFF;
  background-color: #09F;
}
section#m_attention {
  border: 2px solid #d23131;
  background-color: #f3e0e0;
  padding: 20px 10px;
  margin: 20px;
}
section#m_attention b {
  font-size: 15px;
}
.topTextRenew b {
  font-size: 15px;
}
.topTextRenew a {
  color: #ff0000;
}
.sysRemindForm input[type='submit'] {
  width: 22%;
  color: #fff;
  text-align: center;
  cursor: pointer;
}
@media screen and (max-width: 599px) {
  .sysRemindForm input[type='submit'] {
    width: 100%;
  }
}
.sysFuncItemBlock.topRecommended_p {
  width: 100%;
}
#page_top {
  width: 50px;
  height: 50px;
  position: fixed;
  right: 0;
  bottom: 50px;
  background: #3f98ef;
  opacity: 0.6;
  border-radius: 50%;
}
#page_top a {
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}
#page_top a::before {
  font-family: FontAwesome;
  content: '\f102';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
.title_name {
  color: #0000a0;
  font-weight: bold;
}
.box5 {
  padding: 0.5em 1em;
  margin: 2em 0;
  border: double 5px #4ec4d3;
}
.box5 p {
  margin: 0;
  padding: 0;
}
.box2 {
  padding: 0.5em 1em;
  margin: 2em 0;
  font-weight: bold;
  color: #6091d3;
  background: #FFF;
  border: solid 3px #6091d3;
  border-radius: 10px;
}
.box2 p {
  margin: 0;
  padding: 0;
}
.box3 {
  padding: 0.5em 1em;
  margin: 2em 0;
  color: #2c2c2f;
  background: #cde4ff;
}
.box3 p {
  margin: 0;
  padding: 0;
}
.box4 {
  padding: 8px 19px;
  margin: 2em 0;
  color: #2c2c2f;
  background: #cde4ff;
  border-top: solid 5px #5989cf;
  border-bottom: solid 5px #5989cf;
}
.box4 p {
  margin: 0;
  padding: 0;
}
.box5 {
  padding: 0.5em 1em;
  margin: 2em 0;
  border: double 5px #4ec4d3;
}
.box5 p {
  margin: 0;
  padding: 0;
}
.box6 {
  padding: 0.5em 1em;
  margin: 2em 0;
  background: #f0f7ff;
  border: dashed 2px #5b8bd0;
}
.box6 p {
  margin: 0;
  padding: 0;
}
.box7 {
  padding: 0.5em 1em;
  margin: 2em 0;
  color: #474747;
  background: whitesmoke;
  border-left: double 7px #4ec4d3;
  border-right: double 7px #4ec4d3;
}
.box7 p {
  margin: 0;
  padding: 0;
}
.box8 {
  padding: 0.5em 1em;
  margin: 2em 0;
  color: #232323;
  background: #fff8e8;
  border-left: solid 10px #ffc06e;
}
.box8 p {
  margin: 0;
  padding: 0;
}
.box9 {
  padding: 0.5em 1em;
  margin: 2em 0;
  color: #ff7d6e;
  background: #ffebe9;
  border-top: solid 10px #ff7d6e;
}
.box9 p {
  margin: 0;
  padding: 0;
}
.box10 {
  padding: 0.5em 1em;
  margin: 2em 0;
  color: #00BCD4;
  background: #e4fcff;
  border-top: solid 6px #1dc1d6;
  box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);
}
.box10 p {
  margin: 0;
  padding: 0;
}
.box11 {
  padding: 0.5em 1em;
  margin: 1em 0;
  color: #5d627b;
  background: white;
  border-top: solid 5px #5d627b;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.22);
}
.box11 p {
  margin: 0;
  padding: 0;
}
.box12 {
  padding: 0.5em 1em;
  margin: 2em 0;
  color: #5989cf;
  background: #c6e4ff;
  border-bottom: solid 6px #aac5de;
  border-radius: 9px;
}
.box12 p {
  margin: 0;
  padding: 0;
}
.box13 {
  padding: 0.5em 1em;
  margin: 2em 0;
  color: #FFF;
  background: #6eb7ff;
  border-bottom: solid 6px #3f87ce;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.25);
  border-radius: 9px;
}
.box13 p {
  margin: 0;
  padding: 0;
}
.box24 {
  position: relative;
  padding: 0.5em 0.7em;
  margin: 2em 0;
  background: #e6f4ff;
  color: #5c98d4;
  font-weight: bold;
}
.box24:after {
  position: absolute;
  content: '';
  top: 100%;
  left: 30px;
  border: 15px solid transparent;
  border-top: 15px solid #e6f4ff;
  width: 0;
  height: 0;
}
.box24 p {
  margin: 0;
  padding: 0;
}
.box30 {
  margin: 2em 0;
  background: #f1f1f1;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
}
.box30 .box-title {
  font-size: 1.2em;
  background: #23466e;
  padding: 4px;
  text-align: center;
  color: #FFF;
  font-weight: bold;
  letter-spacing: 0.05em;
}
.box30 p {
  padding: 15px 20px;
  margin: 0;
}
.point {
  position: relative;
  margin: 2em 0;
  padding: 0.5em 1em;
  border: solid 3px #62c1ce;
}
.point .point-title {
  position: absolute;
  display: inline-block;
  top: -27px;
  left: -3px;
  padding: 0 9px;
  height: 25px;
  line-height: 25px;
  vertical-align: middle;
  font-size: 17px;
  background: #62c1ce;
  color: #ffffff;
  font-weight: bold;
  border-radius: 5px 5px 0 0;
}
.point p {
  margin: 0;
  padding: 0;
}
#page_top {
  width: 50px;
  height: 50px;
  position: fixed;
  right: 0;
  bottom: 0;
  background: #fff;
  opacity: 0.7;
  border-radius: 50%;
}
#page_top a {
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}
#page_top a::before {
  font-family: FontAwesome;
  content: '\f139';
  font-size: 58px;
  color: #3f98ef;
  position: absolute;
  width: 50px;
  height: 87px;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
.balloon5 {
  width: 100%;
  margin: 1.5em 0;
  overflow: hidden;
}
.balloon5 .faceicon {
  float: left;
  margin-right: -90px;
  width: 80px;
}
.balloon5 .faceicon img {
  width: 100%;
  height: auto;
  border: solid 3px #d7ebfe;
  border-radius: 50%;
}
.balloon5 .chatting {
  width: 100%;
}
.says {
  display: inline-block;
  position: relative;
  margin: 5px 0 0 105px;
  padding: 17px 13px;
  border-radius: 12px;
  background: #d7ebfe;
}
.says:after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 18px;
  left: -24px;
  border: 12px solid transparent;
  border-right: 12px solid #d7ebfe;
}
.says p {
  margin: 0;
  padding: 0;
}

/***カードリンク　***/
.item-box {
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
  box-shadow: 1px 1px 5px #ccc;
}
.item-box:after {
  content: '';
  display: block;
  clear: both;
}
.item-box img {
  max-width: 100%;
}
.item-box>div {
  float: left;
  width: 50%;
}
.item-box-left {
  padding-left: 0;
}
.item-box-right {
  position: relative;
}
.item-box-right h4 {
  margin: 0;
  padding: 10px;
  background: #eee;
  border-radius: 5px;
}
.item-box-right h4 a {
  letter-spacing: 1px;
  font-size: 20px;
  font-weight: bold;
  color: #666;
  margin-top: 0;
  padding-top: 0;
}
.item-box-right p {
  font-size: 14px;
}
.item-box-right .item-btn {
  font-size: 18px;
  text-decoration: none;
  letter-spacing: 1px;
  display: block;
  text-align: center;
  padding: 10px 20px;
  color: #fff;
  background-color: #4CAF50;
  border-radius: 5px;
  box-shadow: 2px 2px 0 #2E7D32, 0px 3px rgba(0, 0, 0, 0.5);
}
.item-box-right .item-btn a {
  text-decoration: none;
  color: #fff;
  display: block;
}
.item-box-right .item-label {
  background-color: #FBC02D;
  display: inline-block;
  border-radius: 50%;
  height: 80px;
  width: 80px;
  line-height: 80px;
  text-align: center;
  color: #fff;
  position: absolute;
  top: -50px;
  right: -50px;
  transform: rotate(10deg);
  box-shadow: 1px 1px 5px #ccc;
}
@media screen and (max-width: 720px) {
  .item-box>div {
    width: 100%;
  }
  .item-box-right {
    margin-top: 40px;
  }
  .item-box-right .item-label {
    right: -20px;
  }
}
#share ul {
  height: auto;
}
#share li {
  font-size: 14px;
  float: left;
  text-align: center;
  width: 84px;
  margin-right: 1%;
  margin-bottom: 8px;
  border-radius: 3px;
  list-style: none;
}
#share li.share-twitter {
  background: #55acee;
  box-shadow: 0 2px #2795e9;
}
#share li.share-twitter:hover {
  background: #83c3f3;
}
#share li.share-facebook {
  background: #3b5998;
  box-shadow: 0 2px #2d4373;
}
#share li.share-facebook:hover {
  background: #4c70ba;
}
#share li.share-google {
  background: #dd4b39;
  box-shadow: 0 2px #c23321;
}
#share li.share-google:hover {
  background: #e47365;
}
#share li.share-hatena {
  background: #2c6ebd;
  box-shadow: 0 2px #225694;
}
#share li.share-hatena:hover {
  background: #4888d4;
}
#share li.share-pocket {
  background: #f13d53;
  box-shadow: 0 2px #e6152f;
}
#share li.share-pocket:hover {
  background: #f26f7f;
}
#share a {
  display: block;
  height: 27px;
  padding-top: 6px;
  color: #ffffff;
  text-decoration: none;
}
#share a:hover {
  text-decoration: none;
  color: #ffffff;
}

/**0921追加css　ヘッダー修正**/
@media screen and (min-width: 959px) {
  .header_wrap_inner {
    max-width: 1100px;
    margin: 0 auto;
  }
  .head_title {
    font-size: 11px;
    font-weight: bold;
    height: 32px;
    line-height: 32px;
    letter-spacing: 1px;
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  .h_inner {
    margin: 15px 0 0;
  }
  .header_h1_under, .header_h1 {
    width: 580px;
    height: 80px;
    float: left;
  }
  .logo_all .logo .menuBtn {
    display: none;
  }
  .header .g_navi li a {
    display: block;
    width: 120px;
    margin: 15px 5px 0;
    height: 30px;
    line-height: 28px;
    font-weight: bold;
    font-size: 12px;
    border: 1px solid #222222;
    border-radius: 20px;
  }
  .header .g_navi li {
    float: left;
    text-align: center;
  }
  .headnavi {
    width: 392px;
    height: 80px;
    float: left;
  }
  #cartInfo {
    float: left;
    position: relative;
    margin-top: 15px;
    margin-left: 5px;
    width: 120px;
    height: 30px;
    line-height: 28px;
    font-weight: bold;
    font-size: 12px;
    border-radius: 20px;
    border: 1px solid #23466e;
    background: #23466e;
    color: #fff;
    text-align: center;
    cursor: pointer;
    padding-top: -10px;
  }
  .h_cart {
    display: none;
    width: 280px;
    height: 145px;
    position: absolute;
    top: 40px;
    right: 5px;
    border: 1px solid #aaa;
    background: #fff;
    color: #000;
    z-index: 110;
    padding: 10px 20px;
  }
  .h_cart dl {
    font-size: 12px;
    margin-bottom: 0px;
  }
  .h_cart dt, .h_cart dd {
    float: left;
  }
  .h_cart dd span {
    display: inline-block;
    color: #da4636;
    font-weight: bold;
    padding: 0 5px;
  }
  .h_cart .sysCartInfoCartIn a {
    display: block;
    background: #000;
    color: #fff;
    width: 100%;
    margin: 10px 0% 5px;
    height: 50px;
    padding: 12px 0 0;
    font-size: 15px;
    font-weight: bold;
    text-align: center;
    border-radius: 5px;
  }
  .h_cart .sysCartInfoCartIn a img {
    display: inline-block;
    width: 25px;
    height: 25px;
    margin-right: 5px;
  }
  #cartInfo p.cartTxt {
    margin: -2px;
    line-height: 21px;
    padding-top: 5px;
    font-size: 10px;
  }
  #cartInfo p img {
    width: 20px;
    height: 20px;
    display: inline-block;
    margin-right: 5px;
  }
  button.itemCount {
    display: none;
    border: none;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    font-weight: bold;
    margin-left: 5px;
    color: #222222;
    background: #fff;
    border-radius: 10px;
  }
  .head_cate {
    display: block;
    padding-top: 80px;
  }
  .head_cate ul {
    display: flex;
    justify-content: space-between;
  }
  .gnav ul li ul {
    display: none;
  }
  .gnav ul li:hover ul {
    !importdisplay: block;
  }
}

/** ９２４追加****/
@media screen and (min-width: 768px) {
  .gidewrap {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }
}

/****927追加**/
.logo img {
  width: 400px;
}
@media screen and (min-width: 960px) {
  .swiper-containera {
    width: 350px;
    padding-bottom: 10px;
    margin: 0 auto;
  }
}
@media screen and (max-width: 959px) {
  .swiper-container {
    width: 100%;
    height: 100vh;
    padding-bottom: 10px;
    margin: 0 auto;
  }
}
.accbox1 {
  margin: 2em 0;
  padding: 0;
  max-width: 400px;
}
.accbox1 label {
  display: block;
  margin: 1.5px 0;
  padding: 11px 12px;
  color: #2f8fcf;
  font-weight: bold;
  background: #a4cbf3;
  cursor: pointer;
  transition: all 0.5s;
}
.accbox1 label:hover {
  background: #85baef;
}
.accbox1 input {
  display: none;
}
.accbox1 .accshow1 {
  height: 0;
  padding: 0;
  overflow: hidden;
  opacity: 0;
  transition: 0.8s;
}
.cssacc1: checked+.accshow1 {
  height: auto;
  padding: 5px;
  background: #eaeaea;
  opacity: 1;
}
#social-icon a {
  margin: 0;
  padding: 10px;
}
#social-icon i {
  color: #23466e;
}
#social-icon a:hover i {
  color: #bcaf68;
}
.ripple {
  position: relative;
  overflow: hidden;
}
.ripple .rp-effect {
  position: absolute;
  border-radius: 50%;
  opacity: 0.35;
  transform: scale(0);
  background: #FFF;
  animation: ripple 700ms;
  pointer-events: none;
}
@-webkit-keyframes ripple {
  to {
    opacity: 0;
    transform: scale(2.0);
  }
}
@keyframes ripple {
  to {
    opacity: 0;
    transform: scale(2.0);
  }
}
header {
  padding: 10px 0px 10px 0px;
  background: #fff;
  display:flex;
}

  #sp-logo {
    width: 50%;
    
  }
  #sp-logo a img {
    width: 100%;
  }


#nav-drawer {
  position: relative;
  display: inline-block;
  width:100px;
}
.nav-unshown {
  display: none;
}
#nav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
}
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 6px;
  width: 45px;
  border-radius: 3px;
  background: #23466e;
  display: block;
  content: '';
  cursor: pointer;
  
}
#nav-open span:before {
  bottom: -12px;
}
#nav-open span:after {
  bottom: -24px;
}
#nav-close {
  display: none;
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  width: 90%;
  max-width: 330px;
  height: 100%;
  background: #fff;
  transition: .3s ease-in-out;
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);
}
#nav-input:checked~#nav-close {
  display: block;
  opacity: .5;
}
#nav-input:checked~#nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
  box-shadow: 6px 0 25px rgba(0, 0, 0, .15);
}
.hidden_box {
  margin: 3em 0;
  padding: 0px;
}
.hidden_box label {
  padding: 15px;
  font-weight: bold;
  border: solid 2px black;
  cursor: pointer;
}
.hidden_box label:hover {
  background: #efefef;
}
.hidden_box input {
  display: none;
}
.hidden_box .hidden_show {
  height: 0;
  padding: 0;
  overflow: hidden;
  opacity: 0;
  transition: 0.8s;
}
.hidden_box input: checked~.hidden_show {
  padding: 30px 0;
  height: auto;
  opacity: 1;
}
.flat_button {
  display: inline-block;
  cursor: pointer;
  text-decoration: none;
  color: #555;
  padding: 0.4em 1.5em;
  transition: .5s;
}
.flat_button:hover {
  background: #FF8A00;
}
.flat_button .rp-effect {
  background: gray;
}
.raisebutton {
  display: inline-block;
  background-color: #FF8A00;
  color: #FFF;
  font-size: 1em;
  line-height: 1;
  text-decoration: none;
  letter-spacing: 0.05em;
  padding: 0.2em 1em;
  border-radius: 3px;
  cursor: pointer;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
  -webkit-tap-highlight-color: transparent;
  transition: .3s ease-out;
}
.raisebutton:hover {
  box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 7px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -1px rgba(0, 0, 0, 0.2);
}
.buttonbigcenter {
  padding: 20px 50px 20px 50px;
  font-size: 16px;
  margin: 10px 0px 20px 60px;
}
#headnavi {
  width: 600px;
  margin-left: 40px;
}
#headnavi ul {
  display: flex;
}
#headnavi ul li {
  margin: 20px;
  text-align: center;
  width: 85px;
  border-color: #333;
  border: 1px solid;
  border-bottom: solid 4px #627295;
  border-radius: 3px;
  padding: 8px;
}
#headnavi ul a {
  text-decoration: none;
}
#headnavi ul a li p {
  font-size: 8px
}
#headnavi ul li:active {
  -ms-transform: translateY(4px);
  -webkit-transform: translateY(4px);
  transform: translateY(4px);
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
  border-bottom: none;
}
.yokuarumidashi {
  background: linear-gradient(transparent 70%, #a7d6ff 70%);
  font-size: 24px;
}
#headlogo {
  left: 0px;
}
#headlogo img {
  width: 200px;
}
.rittaimidasi {
  padding: 0.4em 0.5em;
  color: #494949;
  background: #f4f4f4;
  border-left: solid 5px #7db4e6;
  border-bottom: solid 3px #d7d7d7;
}
.sysOpcNextSubmit {
  margin: 20px;
  padding: 30px 50px 30px 50px;
  background-color: #FF8A00;
  color: #FFF;
}
.sysOpcNextSubmit {
  margin: 20px;
  padding: 10px 50px 10px 50px;
  background-color: #FF8A00;
  color: #FFF;
  cursor: pointer;
}
.sysOPCartSummary h2 {
  font-size: 1.4rem;
  font-weight: 700;
  border-bottom: 1px dotted #ccc;
  line-height: 41px;
  margin: 0;
}
#sysSubmit input {
  padding: 10px 0px 20px 0px;
  height: 60px;
  background-color: #FF8A00;
  color: #FFF;
  font-size: 18px;
  border: 1px solid;
  border-bottom: solid 2px #ccc;
  border-radius: 3px;
}
#sysSubmit input:active {
  -ms-transform: translateY(4px);
  -webkit-transform: translateY(4px);
  transform: translateY(4px);
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
  border-bottom: none;
}
.sysPagination a {
  padding: 5px;
}
.sysFormVariationTable {
  width: 100%;
}
.sysFormVariationTable .sysRetailPriceTaxIncluded {
  display: none;
}
.item_list_box input {
  display: none;
}
.itemlist_cssacc: checked+.item_list_accshow {
  height: auto;
  padding: 5px;
  background: #eaeaea;
  opacity: 1;
  display: block;
}
.sp_hidden_box input {
  display: none;
}
.gidebotton {
  padding: 10px 0px 10px 20px;
  margin-top: 15px;
  width: 50%;
  text-align: : center;
}
.sysOrderHistory .sysOrderList .sysOrder {
  margin-top: 24px;
}
.sysOrderHistory {
  padding: 10px;
  border: 1px solid #bfbfbf;
}
@media screen and (min-width: 981px) {
  .sysMypage .sysMypageNav form {
    width: 33.3333333333333%;
    padding: 0 10px;
    float: left;
  }
}
.item_parts_navi, .item_parts_navi2 {
  display: flex;
}
.sideLogin {
  background-color: #f0f0f0;
}
.table_item_spec {
  width: 100%;
  margin-bottom: 30px;
  margin-top: 10px;
}
@media (min-width: 768px) {
  .table_item_spec th {
    font-weight: 500;
  }
}
@media (max-width: 767px) {
  .table_item_spec th {
    font-weight: 700;
  }
}
.table_item_spec th {
  background: #FFFAF0;
}
.table_item_spec th, .table_item_spec td {
  vertical-align: middle;
  font-size: 0.9rem;
  letter-spacing: 0;
  line-height: 1.2rem;
}
.table.table_item_spec td.item_specinfo {
  width: 70% !important;
}
.table.table_item_spec td.item_specinfo {
  vertical-align: top;
  text-align: left;
}
@media (min-width: 768px) {
  table.table_item_spec td {
    padding: 14px;
  }
}
.sysMypageNav {
  margin-top: 60px;
}
#sysMain .sysItemList .sysItemPrArea span img {
  float: left;
  height: 16px !important;
  font-size: 10px;
  line-height: 1.5;
  padding: 0 .2em;
  margin: 0 2px 2px 0;
  color: #fff;
  font-weight: bold;
  border-radius: 3px;
  width: auto;
}
.mdl-button__ripple-container {
  margin-top: 60px;
}
p.user_type {
  margin-bottom: 20px;
}
p.user_type {
  font-size: 0.8rem;
  font-weight: 700;
  margin-top: 8px;
}
.opc-dlg-close {
  min-width: 2em;
  float: right;
  position: relative;
  top: 0;
  right: 0;
  font-size: xx-large;
  color: #888;
  background: linear-gradient(0deg, #ffffff, #ffffff);
  background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ffffff));
  background: -moz-linear-gradient(top, #ffffff, #ffffff);
  border: none;
  margin: 0;
}
.mdl-dialog__content {
  padding: 60px 40px 60px 40px;
}
#sysBasket #sysMain .sysBackButton {
  margin: 25px auto 0 !important;
}
#show-dlg-opc1, #show-dlg-opc1_low {
  margin: 0.45em 0 0.45em 0;
}
.sysTotal .sysTotalTxt .sysCartAttention {
  font-size: large;
  font-size: 1.5rem;
  padding: 0 0.3em;
  font-weight: bold;
}
li.mdl-list__item {
  width: 100%
}
.order_content__price {
  font-size: 20px;
}
.order_content__ttl {
  margin-top: 10px;
}
.container {
  display: flex;
  flex-wrap: wrap;
}
.container .item {
  margin: 10px;
}
.category_infomation {
  display: flex;
  flex-wrap: wrap;
}
.category_infomation img {
  width: 100%;
}
.arial {
  font-family: Arial, sans-serif;
}
.top_h3 {
  font-size: 2rem;
  margin-bottom: 15px;
  text-align: center;
  border-bottom: 1px solid #333;
}
.item_recomend ul {
  display: inline-flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: flex-end;
}
.item_recomend ul li img {
  width: 100%;
}
.search_word {
  display: inline-flex;
  flex-wrap: wrap;
}
.search_word li {
  margin: 5px;
}
.search_word li a {
  padding: 5px;
  background-color: #EEE;
  text-decoration: none;
  color: #333;
}
.topics_contents ul {
  display: inline-flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: flex-end;
}
.topics_contents ul li {
  max-width: 50%;
}
.topics_contents ul li img {
  width: 100%;
}
.cate_info_item {
  display: inline-flex;
  flex-wrap: wrap;
}
.cate_info_item li img {
  width: 100%;
}
.cate_info_item li {
  width: 50%;
}
.cate_info_item div {
  background-color: #ddd;
}
.footer_area {
  width: 100%;
  padding: 1%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.footer_area p, .footer_area li, .footer_area td {
  font-size: 0.8rem;
}
.souryou_area, .nisesaito, .shiharai, .haisou, .toiawase, .shouhin, .kaisya, .toiawase, .koukan, .cp_setuemi {
  padding: 5%;
  margin-bottom: 5px;
}
.souryou_area table {
  width: 100%;
}
.souryou_area table tr td {
  text-align: center;
}
.souryou980 td {
  background-color: #66ccff;
}
.souryou680 td {
  background-color: #ccffff;
}
.souryou500 td {
  background-color: #99ffcc;
}
.souryou550 td {
  background-color: #ffffcc;
}
.souryou780 td {
  background-color: #ffccff;
}
.souryou1580 td {
  background-color: #ccccff;
}
.souryou td {
  background-color: #0066cc;
}
.last_line {
  background-color: #23466e;
}
.last_line p {
  color: #fff;
  text-align: center;
}
.info_titile {
  color: #23466e;
  font-size: 1.3rem;
  margin-bottom: 10px;
  text-align: center;
  border-bottom: 2px solid #23466e;
}
.bottom_info_titile {
  color: #23466e;
  font-size: 1.1rem;
  margin-bottom: 10px;
  text-align: center;
  border-bottom: 2px solid #23466e;
}
.footer_area1, .footer_area2, .footer_area3 {
  display: flex;
  flex-direction: column;
  width: 30%;
  padding: 1%;
}
.size-area th, .size-area td {
  border: solid 1px;
}
.sabcategory-list-design {
  display: flex;
  flex-wrap: wrap;
}
.sabcategory-list-design li a {
  display: block;
  text-decoration: none;
  text-align: center;
  color: #fff;
}
.sabcategory-list-design li:hover {
  opacity: 0.8;
  filter: alpha(opacity=50);
  -ms-filter: "alpha( opacity=50 )";
  background: #fff;
}
.sabcategory-list-design li a:hover {
  color: #343434;
}
.sysEditReceiptInput .aiBtn {
  padding: 2px;
}
.sysEditReceiptInput input[type="text"] {
  padding: 24px;
  margin-bottom: 10px;
}
.sysOrders li {
  margin-top: 24px;
}
.sysOrderHeader {
  border-top: dashed 2px #ddd;
  margin-top: 10px;
}
.order_content__price {
  clear: both;
}
.sysAmazonNextSubmit {
  background-color: #ffa340;
  box-sizing: border-box;
  display: inline-block;
  border: 1px solid #ff8400;
  border-radius: 5px;
  padding: 5px 15px;
  color: #fff;
  background: linear-gradient(180deg, #ffa340, #ff8400);
  text-align: center;
  width: 100%;
  font-size: 20px;
  font-weight: 700;
  cursor: pointer;
}
@media only screen and (min-width: 541px){
  .sysAmazonNextSubmit {
  margin: 0.45em 0 0.45em 0;
 }
}
#useAmazonSubmitButton form {
  cursor: pointer;
}
@media only screen and (min-width: 541px) {
  #upperAmazonPayButton, #amazonPayTopLoginButton {
    margin: 0 0 0 0 !important;
  }
}
.opcBillingAddress_completeButton_edit {
  width: 100%;
  margin: 15px auto 0;
  font-size: 1.5rem;
  border-radius: 5px;
  font-weight: bold;
  background-color: #ffa340;
  box-sizing: border-box;
  display: inline-block;
  border: 1px solid #ff8400;
  border-radius: 5px;
  padding: 5px 15px;
  color: #fff;
  background: linear-gradient(180deg, #ffa340, #ff8400);
}
.opcBillingAddress_zipCodeSearchButton_edit {
  position: static;
  margin: 15px auto 0;
  font-size: 1.3rem;
  border-radius: 5px;
  font-weight: bold;
  background: #A61C2A;
  padding: 18px 10px;
  color: #fff;
  height: auto;
  margin-bottom: 20px;
}
.opcOrderSummaryTitle, .opcBillingAddressTitle, .opcClientTitle, .opcDeliveryAddressTitle, .opcDeliveryMethodTitle, .opcItemTitle, .opcPaymentMethodTitle, .opcRemarksTitle, .opcSubstituteOrderMemoTitle, .opcPointTitle, .opcCouponCodeTitle, .opcCouponTitle, .opcMemberTitle, .opcRepeatTitle, .opcDeliveryAddressAndItemsTitle, .opcDeliveryAddressHeader, .opcDeliveryMethodHeader, .opcDeliveryAddressItemHeader, .basketCouponTitle {
  font-weight: bold;
  font-size: 16px;
}
.opcCommonRequireLabel {
  font-weight: bold;
}

/* 新Footor用　CSS#*/
footer-widget-area {
  background-color: #23466e;
  display: block;
  box-sizing: border-box;
  display: flex;
  margin: 0 auto;
  width: 100%;
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 10px;
}
@media (min-width: 1200px) {
  #footorcontents {
    width: 1200px;
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media (min-width: 768px) {
  #footorcontents {
    display: flex;
    margin: 0 auto;
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
  }
}
#footorcontents a, #footorcontents h3, #footorcontents p {
  color: #ffffff;
  text-decoration: none;
}
.footerguide01, .footerguide02, .footerguide03 {
  margin: 10px 10px 10px 0px;
  padding-left: 45px;
}
#footorcontents li {
  margin: 0px 0px 0px 20px;
}
#copyright {
  background-color: #061259;
  text-align: center;
  color: #ffffff;
}
#footertop {
  background-color: #EAEFF9;
  padding: 5px 0px 5px 10px;
}
#footertop a {
  color: #23466e;
  text-decoration: none;
}
.footerguide01, .footerguide02, .footerguide03 {
  background: none;
  font-weight: 400;
  border-top: none;
  box-shadow: none;
  border-bottom: 1px solid #fff;
  padding-bottom: 5px;
  padding-left: 5px;
  padding-right: 5px;
}
.footerguide01 {
  flex: 0.8;
}
.footerguide02 {
  flex: 1;
}
.footerguide03 {
  flex: 1;
}
@media (min-width: 768px) {
  .footerguide01 {
    flex: 1;
  }
  .footerguide02, .footerguide03 {
    flex: 1;
    margin-left: 45px;
  }
  .footerguide03 {
    flex: 1;
  }
}
#footer-widget-area {
  background-color:#23466e;
  display: block;
  box-sizing: border-box;
  display: flex;
  margin: 0 auto;
  width: 100%;
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 10px;
}
@media (min-width: 1200px) {
  #footorcontents {
    width: 1200px;
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media (min-width: 768px) {
  #footorcontents {
    display: flex;
    margin: 0 auto;
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
  }
}
#footorcontents a, #footorcontents h3, #footorcontents p {
  color:#ffffff;
  text-decoration: none;
}
.footerguide01, .footerguide02, .footerguide03 {
  margin:10px 10px 10px 0px;
  padding-left:45px;
}
#footorcontents li {
  margin:0px 0px 0px 20px;
}
#copyright {
  background-color:#061259;
  text-align: center;
  color:#ffffff;
}
#footertop {
  background-color:#EAEFF9;
  padding:5px 0px 5px 10px;
}
#footertop a {
  color:#23466e;
  text-decoration: none;
}
.footerguide01, .footerguide02, .footerguide03 {
  background: none;
  font-weight: 400;
  border-top: none;
  box-shadow: none;
  border-bottom: 1px solid #fff;
  padding-bottom: 5px;
  padding-left: 5px;
  padding-right: 5px;
}
.footerguide01 {
  flex: 0.8;
}
.footerguide02 {
  flex: 1;
}
.footerguide03 {
  flex: 1;
}
@media (min-width: 768px) {
  .footerguide01 {
    flex: 1;
  }
  .footerguide02, .footerguide03 {
    flex: 1;
    margin-left: 45px;
  }
  .footerguide03 {
    flex: 1;
  }
}
  /* PCカートページを小さくして中央寄せ　*/
  @media screen and (min-width:1024px) {
    #sysOpc.opc {
      width: 50%;
      margin: 0 auto;
    }
  }
  /* 注文確定ボタンを大きくする */
  .opcConfirm_order {
    margin: 10px 0px 15px 0px;
    font-size: 18px;
  }


/* ミニカート(PC) */
@media screen and (min-width: 960px) {

.minicart {
    text-align: center;
    width: 100%;
    background-color: #efefef;
    padding: 10px 0;
    font-size: 13px;
    margin-bottom: 0 !important;
}
.minicart .sysContent,.minicart .aiContent {
    max-width: 800px;
    margin: 0 auto !important;
    display: flex;
    text-align: center;
}
.minicart dd span {
    color: #ff5080;
    font-weight: bolder;
}
.minicart .sysContent,.minicart .aiContent {
    max-width: auto;
    padding-left: 0 !important;
    text-align: center;
    background: none;
}
.minicart .sysCartInfoItemCount {
    padding-left: 30px;
    background: url(https: //carpikal-japan.com/img/top/ico_cart.png) 0 center no-repeat;
    background-size: 18px;
    margin-right: 20px;
}
.minicart .sysCartInfoTotalPrice,minicart .sysCartInfoRemainFreeShipping {
    margin-right: 40px;
}
.minicart dd, .minicart dl, .minicart dt {
    display: inline-block;
 }
}

/* 注文内容確認画面 */
.opcOrderSummary_normalTotalPrice{

 color: #ff5080;
 font-size: 1.5rem;
}









/* 数量の横のプラマイ消す　*/
.opcItem_decreaseNumButton_edit, .opcItem_increaseNumButton_edit{
display:none;
}


/* PC用グローバルナビホバーメニュー */
 
@media screen and (min-width: 960px) {

.gnavi_wrap{
display:flex;
justify-content: center;
}

.gnavi_oya li{
position:abusolute;
}

.categoryitemnavigation{
  position: relative;
  width: 100%;
  background-color: #f5f5f5;
}
.categoryitemnavigation ul > li{
  display: inline-block;
}
.categoryitemnavigation ul > li > a{
  padding: 6px 30px;
  display: block;
}

.categoryitemnavigation ul > li:hover > a{
  background-color: #efefef;
  color: #444;
}
 
/* Submenu */
 
.categoryitemnavigation ul li ul{
  position: absolute;
  top: 50px;
  left: 0px;
}
.categoryitemnavigation ul li ul li{
  display: block;
}
.categoryitemnavigation ul li ul li a{
  background-color: #efefef;
  font-size: 16px;
  color: #444;
}
.categoryitemnavigation ul li ul li a:hover{
  background-color: #ddd;
}
.categoryitemnavigation ul li ul{
  position: absolute;
  display: none;
    z-index:-9999;
}
.categoryitemnavigation ul li ul li{
  top: -1000px;
}
.categoryitemnavigation ul li:hover ul{
  top: 40px;
  left: auto;
    z-index:10;
    display: block;
}

.categoryitemnavigation ul li ul li a p{
    line-height: 50px;
    display: inline-block;
}
.categoryitemnavigation ul li ul li a img{
 width:50px;
 margin: 0 auto;
}

.categoryitemnavigation ul li ul li:hover a p{
    font-weight: bold; 
}
.categoryitemnavigation ul li ul li a span{
    margin-left: 20px;
}
.categoryitemnavigation ul li ul li a p{
    margin-left: 20px;
}

.categoryitemnavigation ul li ul li a img{
    margin-left: 20px;
}



.sub_menu4{

position:abusolute;

}



.sub_menu10{


    display: flex;
    flex-wrap: wrap;


}


}

/* headerinfo */

.headerinfobun{

display:block;
display:flex;flex-wrap: wrap;width:75%;margin: 0 auto;
}

.headerinfobun img{
width:auto;
height:70px;}


.opcDeliveryMethod_hopeDeliveryDateCommentLabel_edit {
    padding: 30px 0px 30px 0px;
}

.opcDeliveryMethod_completeButton_edit{
  background: #FF8A00;
  color: lemonchiffon;
}


#sysMain > div.sysTotal {
    border: 1px solid #000000;
    margin: 50px 0px 50px 0px;
}



#sysMain > form > input.aiBtn.aiBtnBack{
width:50%;
}

.sysCart#sysRegi #sysMain input[type='submit'].sysLoginButton, .sysCart#sysRegi #sysMain input[type='submit'].sysNextSubmit {
  position: static;
  width:300px;
  margin: 15px auto 0;
  font-size: 1.5rem;
  border-radius: 5px;
  font-weight: bold;
  background: #A61C2A !important;
  padding: 12px 5px !important;
  color: #fff;
  height: auto;
}
#useAmazonSubmitButton > form > input.sysAmazonNextSubmit {
    
    margin-top: 15px;
}


/* =========================================================
   CARPIKAL JAPAN NEW CART 2026
   新カート専用
========================================================= */

.cp-newcart {
  --cp-navy: #1E3A5F;
  --cp-blue: #1261A0;
  --cp-text: #1F2937;
  --cp-muted: #667085;
  --cp-line: #D8E0E8;
  --cp-bg: #F5F7FA;
  --cp-soft: #EEF4FA;

  background: var(--cp-bg) !important;
  color: var(--cp-text);
}

/* ---------- ページ全体 ---------- */

.cp-newcart #sysAll,
.cp-newcart #sysWrap {
  background: transparent !important;
}

.cp-newcart #sysMain {
  width: calc(100% - 32px) !important;
  max-width: 1120px !important;
  margin: 32px auto 64px !important;
  padding: 32px !important;

  background: #fff !important;
  border: 1px solid #E6EBF0 !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 30px rgba(18, 40, 68, 0.06) !important;
}

/* 旧カートCSSの横幅指定が残っていても解除 */
.cp-newcart #sysOpc.opc {
  width: 100% !important;
  max-width: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ---------- 文字 ---------- */

.cp-newcart,
.cp-newcart button,
.cp-newcart input,
.cp-newcart select,
.cp-newcart textarea {
  font-family:
    "Noto Sans JP",
    "Noto Sans Japanese",
    "Yu Gothic",
    "游ゴシック体",
    "メイリオ",
    sans-serif !important;
}

.cp-newcart h1,
.cp-newcart h2,
.cp-newcart h3 {
  color: #102A43;
  letter-spacing: 0.02em;
}

.cp-newcart h2,
.cp-newcart h3 {
  border-left: 4px solid var(--cp-navy);
  padding-left: 12px;
}

/* ---------- リンク ---------- */

.cp-newcart a {
  color: #163A66;
  text-underline-offset: 3px;
}

/* ---------- 入力フォーム ---------- */

.cp-newcart input[type="text"],
.cp-newcart input[type="email"],
.cp-newcart input[type="tel"],
.cp-newcart input[type="password"],
.cp-newcart input[type="number"],
.cp-newcart input[type="search"],
.cp-newcart select,
.cp-newcart textarea {
  min-height: 44px;
  padding: 10px 12px !important;

  background: #fff !important;
  border: 1px solid var(--cp-line) !important;
  border-radius: 8px !important;

  color: var(--cp-text);
  font-size: 16px;

  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}

.cp-newcart input:focus,
.cp-newcart select:focus,
.cp-newcart textarea:focus {
  border-color: var(--cp-blue) !important;
  box-shadow: 0 0 0 3px rgba(18, 97, 160, 0.12) !important;
}

/* ---------- ラジオ選択カード ---------- */

.cp-newcart label:has(input[type="radio"]) {
  border-radius: 10px;
  transition:
    border-color 0.2s ease,
    background-color 0.2s ease,
    box-shadow 0.2s ease;
}

.cp-newcart label:has(input[type="radio"]:checked) {
  border-color: var(--cp-navy) !important;
  background: var(--cp-soft) !important;
  box-shadow: 0 0 0 1px var(--cp-navy) inset;
}

.cp-newcart input[type="radio"],
.cp-newcart input[type="checkbox"] {
  accent-color: var(--cp-navy);
}

/* ---------- ボタン共通 ---------- */

.cp-newcart button,
.cp-newcart input[type="button"],
.cp-newcart input[type="submit"] {
  border-radius: 8px !important;
  font-weight: 700;
  transition:
    background-color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.1s ease;
}

/* メインCTA */
.cp-newcart .cp-primary-action {
  display: block !important;

  width: 100% !important;
  min-height: 52px !important;
  padding: 13px 24px !important;
  margin-left: auto !important;
  margin-right: auto !important;

  background: var(--cp-blue) !important;
  border: 1px solid var(--cp-blue) !important;
  border-radius: 9px !important;

  color: #fff !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  text-align: center !important;
  text-decoration: none !important;

  box-shadow: 0 4px 12px rgba(18, 97, 160, 0.18) !important;
  cursor: pointer;
}

.cp-newcart .cp-primary-action:hover {
  background: #0E548C !important;
  border-color: #0E548C !important;
  color: #fff !important;
}

.cp-newcart .cp-primary-action:active {
  transform: translateY(1px);
  box-shadow: 0 2px 6px rgba(18, 97, 160, 0.16) !important;
}

/* 戻る系は控えめに */
.cp-newcart .cp-secondary-action {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;

  color: #344054 !important;
  font-weight: 500 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

/* ---------- スマートフォン ---------- */

@media screen and (max-width: 767px) {

  .cp-newcart #sysMain {
    width: calc(100% - 20px) !important;
    margin: 10px auto 40px !important;
    padding: 20px 16px 28px !important;

    border-radius: 12px !important;
    box-shadow: 0 3px 16px rgba(18, 40, 68, 0.05) !important;
  }

  .cp-newcart h1 {
    font-size: 22px !important;
    line-height: 1.4 !important;
  }

  .cp-newcart h2,
  .cp-newcart h3 {
    font-size: 19px !important;
    line-height: 1.5 !important;
  }

  .cp-newcart .cp-primary-action {
    min-height: 54px !important;
    font-size: 16px !important;
  }

  .cp-newcart input[type="text"],
  .cp-newcart input[type="email"],
  .cp-newcart input[type="tel"],
  .cp-newcart input[type="password"],
  .cp-newcart input[type="number"],
  .cp-newcart input[type="search"],
  .cp-newcart select,
  .cp-newcart textarea {
    font-size: 16px !important;
  }
}

/* =========================================================
   CARPIKAL JAPAN NEW CART 2026 END
========================================================= */

/* =========================================================
   CARPIKAL NEW CART - STEP 2
========================================================= */

/* 上側の注文確定ボタンを非表示 */
.cp-newcart.cp-page-confirm .cp-confirm-top-action {
  display: none !important;
}


/* -----------------------------------------
   スマホ：次へ進むボタンを最優先
----------------------------------------- */

@media screen and (max-width: 767px) {

  .cp-newcart.cp-page-entry .cp-primary-parent,
  .cp-newcart.cp-page-entry .cp-secondary-parent {
    width: 100% !important;
    max-width: none !important;
    flex: 0 0 100% !important;
    float: none !important;
  }

  .cp-newcart.cp-page-entry .cp-primary-parent {
    order: 1;
    margin-top: 20px !important;
  }

  .cp-newcart.cp-page-entry .cp-secondary-parent {
    order: 2;
    margin-top: 10px !important;
    text-align: center !important;
  }

  .cp-newcart.cp-page-entry .cp-primary-action {
    width: 100% !important;
    max-width: none !important;
    min-height: 56px !important;

    font-size: 16px !important;
    font-weight: 700 !important;
  }

  .cp-newcart.cp-page-entry .cp-secondary-action {
    display: inline-block !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 8px 16px !important;
    margin: 0 auto !important;
  }

}


/* -----------------------------------------
   カートの商品名をスマホ向けに調整
----------------------------------------- */

@media screen and (max-width: 767px) {

  .cp-newcart.cp-page-basket a,
  .cp-newcart.cp-page-basket strong {
    line-height: 1.5;
  }

  .cp-newcart.cp-page-basket h3,
  .cp-newcart.cp-page-basket h4 {
    font-size: 17px !important;
    line-height: 1.55 !important;
    letter-spacing: 0 !important;
  }

}


/* -----------------------------------------
   注文確認
----------------------------------------- */

.cp-newcart.cp-page-confirm .cp-primary-action {
  min-height: 56px !important;
}

@media screen and (max-width: 767px) {

  .cp-newcart.cp-page-confirm .cp-primary-action {
    width: 100% !important;
    max-width: none !important;
  }

}
/* =========================================================
   CARPIKAL NEW CART - STEP 3
   aiship動的生成対策
========================================================= */


/* 注文確認画面
   上側の注文確定ボタンだけ消す */
.cp-newcart.cp-page-confirm
.cp-confirm-top-action {
  display: none !important;
}


/* スマホ：情報入力の最後の操作 */
@media screen and (max-width: 767px) {

  /* メインボタン */
  .cp-newcart.cp-page-entry
  .cp-primary-action {
    width: 100% !important;
    max-width: none !important;
    min-height: 56px !important;

    margin: 0 !important;
    padding: 14px 18px !important;

    font-size: 16px !important;
    font-weight: 700 !important;
  }


  /* メインボタン側の親 */
  .cp-newcart.cp-page-entry
  .cp-primary-parent {
    width: 100% !important;
    max-width: none !important;

    flex: 0 0 100% !important;

    margin-top: 18px !important;
  }


  /* 戻る側の親 */
  .cp-newcart.cp-page-entry
  .cp-secondary-parent {
    width: 100% !important;
    max-width: none !important;

    flex: 0 0 100% !important;

    margin-top: 8px !important;

    text-align: center !important;
  }


  /* 同じ親要素に
     戻る＋次へが入っている場合 */
  .cp-newcart.cp-page-entry
  .cp-primary-parent.cp-secondary-parent {

    display: flex !important;
    flex-direction: column !important;

    width: 100% !important;

    gap: 8px !important;
  }


  .cp-newcart.cp-page-entry
  .cp-primary-parent.cp-secondary-parent
  .cp-primary-action {

    order: 1 !important;

    width: 100% !important;
  }


  .cp-newcart.cp-page-entry
  .cp-primary-parent.cp-secondary-parent
  .cp-secondary-action {

    order: 2 !important;

    align-self: center !important;

    width: auto !important;
    min-width: 0 !important;

    margin: 0 auto !important;
    padding: 8px 16px !important;
  }

}
/* =========================================================
   CARPIKAL NEW CART - CHECKOUT HEADER
========================================================= */

.cp-cart-header {
  width: 100%;
  background: #ffffff;
  border-bottom: 1px solid #e2e8f0;
}

.cp-cart-header__inner {
  width: calc(100% - 40px);
  max-width: 1120px;
  min-height: 76px;

  margin: 0 auto;
  padding: 12px 0;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.cp-cart-header__logo {
  display: block;
  text-decoration: none !important;
}

.cp-cart-header__logo img {
  display: block;
  width: 170px;
  max-width: 100%;
  height: auto;
}

.cp-cart-header__info {
  display: flex;
  flex-direction: column;
  align-items: flex-end;

  color: #1f2937;
  line-height: 1.4;
}

.cp-cart-header__info span {
  color: #667085;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
}

.cp-cart-header__info strong {
  margin-top: 2px;

  color: #1e3a5f;
  font-size: 15px;
  font-weight: 700;
}


/* スマホ */
@media screen and (max-width: 767px) {

  .cp-cart-header__inner {
    width: calc(100% - 32px);
    min-height: 66px;

    padding: 10px 0;
  }

  .cp-cart-header__logo img {
    width: 150px;
    max-width: 48vw;
  }

  .cp-cart-header__info span {
    display: none;
  }

  .cp-cart-header__info strong {
    margin: 0;

    color: #667085;
    font-size: 12px;
    font-weight: 500;
  }

}
/* =========================================================
   CARPIKAL LOGO RESPONSIVE
========================================================= */

.cp-cart-header__logo picture {
  display: block;
}

.cp-cart-header__logo img {
  display: block;
  width: 190px;
  max-width: 100%;
  height: auto;
}

/* スマホ */
@media screen and (max-width: 767px) {

  .cp-cart-header__logo img {
    width: 155px;
    max-width: 52vw;
  }

}

/* =========================================================
   CARPIKAL NEW CART - 商品カード仕上げ
========================================================= */

/* 商品画像と商品情報の並び */
.cp-newcart.cp-page-basket .sysCheckoutProductListItemHeader {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 16px !important;
}

/* 商品画像 */
.cp-newcart.cp-page-basket .sysCheckoutProductListItemImageLink {
  display: block !important;
  flex: 0 0 auto !important;
}

.cp-newcart.cp-page-basket .sysCheckoutImage {
  display: block !important;
  object-fit: contain !important;
  border-radius: 8px !important;
}

/* 商品情報 */
.cp-newcart.cp-page-basket .sysCheckoutProductListItemInfo {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  gap: 8px !important;
}

/* 容量 */
.cp-newcart.cp-page-basket .sysCheckoutProductListItemVariation {
  margin-top: 6px !important;
  color: #475467 !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
}


/* ===============================
   スマホ
================================ */
@media screen and (max-width: 767px) {

  .cp-newcart.cp-page-basket .sysCheckoutProductListItemHeader {
    gap: 12px !important;
    align-items: flex-start !important;
  }

  .cp-newcart.cp-page-basket .sysCheckoutProductListItemImageLink,
  .cp-newcart.cp-page-basket .sysCheckoutImage {
    width: clamp(118px, 34vw, 140px) !important;
    height: clamp(118px, 34vw, 140px) !important;
  }

  .cp-newcart.cp-page-basket .sysCheckoutProductListItemName {
    font-size: 16px !important;
    line-height: 1.45 !important;
    font-weight: 700 !important;
  }

  .cp-newcart.cp-page-basket .sysCheckoutProductListItemVariation {
    font-size: 13px !important;
  }

}

/* =========================================================
   PC版：注文確認の上側CTAを復活
   スマホは下側のみ表示
========================================================= */

@media screen and (min-width: 768px) {

  .cp-newcart.cp-page-confirm
  .cp-confirm-top-action {
    display: block !important;
    width: 100% !important;
    min-height: 52px !important;
    margin-top: 16px !important;
  }

}

/* =========================================================
   CARPIKAL NEW CART - PC最終微調整
========================================================= */

/* PC：右のお支払金額をスクロール追従 */
@media screen and (min-width: 1024px) {

  .cp-newcart.cp-page-confirm
  .sysCheckoutConfirmSummary {
    position: sticky !important;
    top: 24px !important;
    align-self: start !important;
    z-index: 20 !important;
  }

  /* 以前指定した内側stickyを解除 */
  .cp-newcart.cp-page-confirm
  .sysCheckoutConfirmSummary
  .sysCheckoutCheckoutSummaryArea {
    position: static !important;
    top: auto !important;
  }

}


/* 注文確認：完了済みの情報入力ステップ */
.cp-newcart.cp-page-confirm
.sysCheckoutProgressBarStep:first-child
.sysCheckoutProgressBarCircle {
  background: #1E3A5F !important;
  border-color: #1E3A5F !important;
  color: #fff !important;
}

.cp-newcart.cp-page-confirm
.sysCheckoutProgressBarStep:first-child
.sysCheckoutProgressBarCircle svg {
  display: none !important;
}

.cp-newcart.cp-page-confirm
.sysCheckoutProgressBarStep:first-child
.sysCheckoutProgressBarCircle::after {
  content: "✓" !important;
  display: block !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}


/* 「[2ステップ完了]」を普通の表記に */
.cp-newcart.cp-page-confirm
.sysCheckoutProgressBarStep:first-child
.sysCheckoutProgressBarLabel {
  font-size: 0 !important;
}

.cp-newcart.cp-page-confirm
.sysCheckoutProgressBarStep:first-child
.sysCheckoutProgressBarLabel::after {
  content: "情報入力" !important;
  display: block !important;
  color: #667085 !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}


/* 空カート画面 */
.cp-newcart .cp-empty-cart {
  padding: 34px 16px !important;
  text-align: center;
}

.cp-newcart .cp-empty-cart__title {
  margin-bottom: 8px !important;
  color: #102A43;
  font-size: 18px !important;
  font-weight: 700;
}

.cp-newcart .cp-empty-cart__text {
  margin-bottom: 20px !important;
  color: #667085;
  font-size: 14px !important;
}

.cp-newcart .cp-empty-cart__button {
  display: inline-flex !important;
  min-height: 48px;
  padding: 12px 28px;

  align-items: center;
  justify-content: center;

  background: #1261A0 !important;
  border-radius: 8px;

  color: #fff !important;
  font-weight: 700;
  text-decoration: none !important;
  box-shadow: 0 4px 12px rgba(18, 97, 160, 0.16);
}
/* =========================================================
   CARPIKAL JAPAN 2026
   商品詳細ページ / スマホ 第1弾
========================================================= */

@media screen and (max-width: 767px) {

  /* -----------------------------------------
     商品ページ全体
  ----------------------------------------- */

  #sysItemDetail #sysMain {
    padding-left: 14px !important;
    padding-right: 14px !important;
    padding-bottom: 48px !important;
  }


  /* -----------------------------------------
     パンくず
  ----------------------------------------- */

  #sysItemDetail #sysMain .sysCategoryPankuzu {
    margin: 8px 0 14px !important;
    padding: 9px 11px !important;

    background: #F5F7FA !important;
    border-radius: 7px !important;

    color: #667085 !important;
    font-size: 11px !important;
    line-height: 1.6 !important;
  }

  #sysItemDetail #sysMain .sysCategoryPankuzu a {
    color: #475467 !important;
    font-size: 11px !important;
  }


  /* -----------------------------------------
     商品名
  ----------------------------------------- */

  #sysItemDetail #sysMain .sysItemName h1,
  #sysItemDetail #sysMain .itemInfo .sysItemName h1,
  #sysItemDetail #sysMain .iteminfo .sysItemName h1 {

    margin: 0 0 12px !important;

    color: #102A43 !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
    letter-spacing: 0 !important;
  }


  /* -----------------------------------------
     メイン商品画像
  ----------------------------------------- */

  #sysItemDetail #sysMain .itemImg,
  #sysItemDetail #sysMain .itemimg {
    width: 100% !important;
    margin-top: 16px !important;
  }

  #sysItemDetail #sysMain .itemImg .sysMainImage,
  #sysItemDetail #sysMain .itemimg .sysMainImage {

    overflow: hidden !important;

    padding: 0 !important;

    background: #fff !important;
    border: 1px solid #EAECF0 !important;
    border-radius: 12px !important;

    box-shadow: none !important;
  }

  #sysItemDetail #sysMain .itemImg .sysMainImage img,
  #sysItemDetail #sysMain .itemimg .sysMainImage img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
  }


  /* -----------------------------------------
     商品情報
  ----------------------------------------- */

  #sysItemDetail #sysMain .itemInfo,
  #sysItemDetail #sysMain .iteminfo {

    width: 100% !important;
    margin-top: 20px !important;
    padding: 0 !important;
  }


  /* 一言説明 */
  #sysItemDetail #sysMain .itemInfo .sysDescription,
  #sysItemDetail #sysMain .iteminfo .sysDescription {

    margin: 0 0 14px !important;

    color: #475467 !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
  }


  /* -----------------------------------------
     価格
  ----------------------------------------- */

  #sysItemDetail #sysMain .itemInfo .sysRetailPrice,
  #sysItemDetail #sysMain .iteminfo .sysRetailPrice {

    margin: 14px 0 18px !important;

    color: #102A43 !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
  }


  /* -----------------------------------------
     容量選択
  ----------------------------------------- */

  #sysItemDetail #sysMain .sysFormVariationTable {

    width: 100% !important;
    margin: 10px 0 18px !important;

    border-collapse: separate !important;
    border-spacing: 0 !important;

    border: 1px solid #D0D5DD !important;
    border-radius: 9px !important;

    overflow: hidden !important;
  }

  #sysItemDetail #sysMain .sysFormVariationTable th,
  #sysItemDetail #sysMain .sysFormVariationTable td {

    padding: 9px 3px !important;

    background: #fff !important;
    border-color: #EAECF0 !important;

    color: #344054 !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
    text-align: center !important;
  }

  #sysItemDetail #sysMain .sysFormVariationTable th {
    background: #F8FAFC !important;
    font-weight: 700 !important;
  }

  #sysItemDetail #sysMain input[type="radio"] {
    width: 20px !important;
    height: 20px !important;

    accent-color: #1E3A5F !important;
  }


  /* -----------------------------------------
     数量
  ----------------------------------------- */

  #sysItemDetail #sysMain .itemInfo .sysForm,
  #sysItemDetail #sysMain .iteminfo .sysForm {
    margin-top: 14px !important;
  }

  #sysItemDetail #sysMain #sysNumber select {

    min-height: 44px !important;

    padding: 0 34px 0 12px !important;

    background-color: #fff !important;
    border: 1px solid #D0D5DD !important;
    border-radius: 8px !important;

    color: #1F2937 !important;
    font-size: 16px !important;
  }


  /* 数量＋− */
  #sysItemDetail #sysMain .aiBtn.aiBtnPlus,
  #sysItemDetail #sysMain .aiBtn.aiBtnMinus {

    min-height: 42px !important;
    margin-top: 8px !important;

    background: #F2F4F7 !important;
    border: 1px solid #D0D5DD !important;
    border-radius: 7px !important;

    color: #344054 !important;

    font-size: 13px !important;
    line-height: 42px !important;
  }


  /* -----------------------------------------
     カートに入れる
  ----------------------------------------- */

  #sysItemDetail #sysMain #sysSubmit {
    margin-top: 14px !important;
  }

  #sysItemDetail #sysMain #sysSubmit input,
  #sysItemDetail #sysMain #sysSubmit .sysCartButton {

    display: block !important;

    width: 100% !important;
    max-width: none !important;
    min-height: 56px !important;

    margin: 0 !important;
    padding: 14px 16px !important;

    background: #1261A0 !important;
    border: 1px solid #1261A0 !important;
    border-radius: 10px !important;

    color: #fff !important;

    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;

    text-align: center !important;

    box-shadow: 0 5px 14px rgba(18, 97, 160, 0.18) !important;
  }


  /* -----------------------------------------
     商品説明内画像
     はみ出し防止
  ----------------------------------------- */

  #sysItemDetail #sysExplanation img {
    max-width: 100% !important;
    height: auto !important;
  }

}

/* =========================================================
   CARPIKAL JAPAN 2026
   GLOBAL HEADER
========================================================= */

header.cp-global-header {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;

  background: #fff !important;

  color: #102A43;

  font-family:
    "Noto Sans JP",
    "Noto Sans Japanese",
    "Yu Gothic",
    "游ゴシック体",
    "メイリオ",
    sans-serif;

  box-sizing: border-box;
  position: relative;
  z-index: 1000;
}

.cp-global-header *,
.cp-global-header *::before,
.cp-global-header *::after {
  box-sizing: border-box;
}

.cp-global-header a {
  color: inherit;
  text-decoration: none !important;
}

.cp-global-header svg {
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}


/* =========================================================
   SP / TABLET
========================================================= */

.cp-global-header--sp {
  display: none !important;
}

@media screen and (max-width: 959px) {

  .cp-global-header--sp {
    display: block !important;
  }

  .cp-global-header--pc {
    display: none !important;
  }


  .cp-sp-menu-toggle {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }


  /* HEADER BAR */

  .cp-sp-headerbar {
    width: 100%;
    height: 68px;

    padding: 0 14px;

    display: grid;
    grid-template-columns: 46px 1fr auto;
    align-items: center;

    background: #fff;

    border-bottom: 1px solid #E4E7EC;
  }


  /* MENU BUTTON */

  .cp-sp-menu-button {
    display: flex;
    width: 44px;
    height: 44px;

    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 5px;

    cursor: pointer;
  }

  .cp-sp-menu-button span {
    display: block;

    width: 24px;
    height: 2px;

    background: #1E3A5F;

    border-radius: 10px;
  }


  /* LOGO */

  .cp-sp-logo {
    display: block;

    justify-self: center;
  }

  .cp-sp-logo img {
    display: block;

    width: 158px !important;
    max-width: 42vw !important;
    height: auto !important;
  }


  /* ACTIONS */

  .cp-sp-actions {
    display: flex;
    align-items: center;

    gap: 4px;
  }

  .cp-sp-action {
    display: flex;

    width: 40px;
    height: 44px;

    align-items: center;
    justify-content: center;

    color: #1E3A5F !important;
  }

  .cp-sp-action svg {
    width: 23px;
    height: 23px;
  }


  /* OVERLAY */

  .cp-sp-menu-overlay {
    visibility: hidden;

    position: fixed;

    inset: 0;

    z-index: 1001;

    background: rgba(16, 42, 67, 0.46);

    opacity: 0;

    transition: opacity .22s ease;
  }


  /* DRAWER */

  .cp-sp-drawer {
    position: fixed;

    top: 0;
    bottom: 0;
    left: 0;

    z-index: 1002;

    width: min(86vw, 350px);

    overflow-y: auto;

    background: #fff;

    box-shadow: 12px 0 30px rgba(16, 42, 67, 0.14);

    transform: translateX(-105%);

    transition: transform .25s ease;
  }


  .cp-sp-menu-toggle:checked
  ~ .cp-sp-menu-overlay {
    visibility: visible;

    opacity: 1;
  }

  .cp-sp-menu-toggle:checked
  ~ .cp-sp-drawer {
    transform: translateX(0);
  }


  /* DRAWER HEAD */

  .cp-sp-drawer-head {
    min-height: 68px;

    padding: 0 18px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    border-bottom: 1px solid #E4E7EC;
  }

  .cp-sp-drawer-head strong {
    color: #102A43;

    font-size: 14px;
    letter-spacing: .12em;
  }

  .cp-sp-drawer-close {
    display: flex;

    width: 42px;
    height: 42px;

    align-items: center;
    justify-content: center;

    color: #667085;

    font-size: 30px;
    font-weight: 300;

    cursor: pointer;
  }


  /* DRAWER SEARCH */

  .cp-sp-drawer-search {
    padding: 18px;
  }

  .cp-sp-drawer-search form {
    position: relative;

    width: 100%;
  }

  .cp-sp-drawer-search input[type="search"] {
    width: 100% !important;
    height: 46px !important;

    padding: 0 48px 0 14px !important;

    background: #F8FAFC !important;

    border: 1px solid #D0D5DD !important;
    border-radius: 8px !important;

    color: #1F2937;

    font-size: 16px !important;
  }

  .cp-sp-drawer-search button {
    position: absolute;

    top: 1px;
    right: 1px;

    width: 44px !important;
    height: 44px !important;

    padding: 0 !important;

    display: flex;

    align-items: center;
    justify-content: center;

    background: transparent !important;

    border: 0 !important;

    color: #1261A0 !important;
  }

  .cp-sp-drawer-search button svg {
    width: 21px;
    height: 21px;
  }


  /* DRAWER NAV */

  .cp-sp-drawer-nav {
    padding: 0 18px 20px;
  }

  .cp-sp-drawer-nav a {
    min-height: 54px;

    padding: 13px 4px;

    display: flex;

    align-items: center;
    justify-content: space-between;

    border-bottom: 1px solid #EAECF0;

    color: #344054 !important;

    font-size: 14px;
  }

  .cp-sp-drawer-nav a b {
    color: #98A2B3;

    font-size: 24px;
    font-weight: 300;
  }

  .cp-sp-drawer-nav-main {
    margin-bottom: 8px;

    padding: 15px 14px !important;

    background: #EEF4FA;

    border: 1px solid #D9E5F0 !important;
    border-radius: 9px;
  }

  .cp-sp-drawer-nav-main strong {
    display: block;

    color: #102A43;

    font-size: 16px;
  }

  .cp-sp-drawer-nav-main small {
    display: block;

    margin-top: 3px;

    color: #667085;

    font-size: 11px;
  }


  /* DRAWER BOTTOM */

  .cp-sp-drawer-bottom {
    margin: 0 18px 24px;
    padding-top: 18px;

    display: flex;

    flex-direction: column;

    border-top: 1px solid #EAECF0;
  }

  .cp-sp-drawer-bottom strong {
    color: #1E3A5F;

    font-size: 12px;
    letter-spacing: .08em;
  }

  .cp-sp-drawer-bottom span {
    margin-top: 3px;

    color: #98A2B3;

    font-size: 11px;
  }

}


/* =========================================================
   PC
========================================================= */

.cp-global-header--pc {
  display: none !important;
}

@media screen and (min-width: 960px) {

  .cp-global-header--pc {
    display: block !important;
  }

  .cp-global-header--sp {
    display: none !important;
  }


  /* TOP BAR */

  .cp-pc-topbar {
    background: #102A43;
  }

  .cp-pc-topbar-inner {
    width: calc(100% - 48px);
    max-width: 1200px;
    height: 28px;

    margin: 0 auto;

    display: flex;
    align-items: center;
    justify-content: space-between;

    color: rgba(255,255,255,.86);

    font-size: 10px;
    letter-spacing: .08em;
  }


  /* MAIN */

  .cp-pc-main {
    width: calc(100% - 48px);
    max-width: 1200px;
    min-height: 86px;

    margin: 0 auto;

    display: flex;
    align-items: center;

    gap: 34px;
  }


  /* LOGO */

  .cp-pc-logo {
    display: block;

    flex: 0 0 auto;
  }

  .cp-pc-logo img {
    display: block;

    width: 200px !important;
    height: auto !important;
  }


  /* SEARCH */

  .cp-pc-search {
    flex: 1 1 auto;

    max-width: 560px;
  }

  .cp-pc-search form {
    position: relative;

    width: 100%;
  }

  .cp-pc-search input[type="search"] {
    width: 100% !important;
    height: 46px !important;

    padding: 0 52px 0 16px !important;

    background: #F8FAFC !important;

    border: 1px solid #D0D5DD !important;
    border-radius: 9px !important;

    color: #1F2937;

    font-size: 14px !important;
  }

  .cp-pc-search input[type="search"]:focus {
    border-color: #1261A0 !important;

    box-shadow: 0 0 0 3px rgba(18, 97, 160, .10);
  }

  .cp-pc-search button {
    position: absolute;

    top: 1px;
    right: 1px;

    width: 46px !important;
    height: 44px !important;

    padding: 0 !important;

    display: flex;

    align-items: center;
    justify-content: center;

    background: transparent !important;

    border: 0 !important;

    color: #1261A0 !important;

    cursor: pointer;
  }

  .cp-pc-search button svg {
    width: 22px;
    height: 22px;
  }


  /* ACTIONS */

  .cp-pc-actions {
    margin-left: auto;

    display: flex;

    align-items: center;

    gap: 8px;
  }

  .cp-pc-action {
    min-width: 88px;
    height: 50px;

    padding: 0 14px;

    display: flex;

    flex-direction: column;

    align-items: center;
    justify-content: center;

    gap: 3px;

    border: 1px solid #D0D5DD;
    border-radius: 9px;

    color: #344054 !important;

    font-size: 11px;

    transition:
      background .2s ease,
      border-color .2s ease;
  }

  .cp-pc-action:hover {
    background: #F8FAFC;

    border-color: #98A2B3;
  }

  .cp-pc-action svg {
    width: 20px;
    height: 20px;
  }


  .cp-pc-action--cart {
    background: #1261A0;

    border-color: #1261A0;

    color: #fff !important;
  }

  .cp-pc-action--cart:hover {
    background: #0E548C;

    border-color: #0E548C;
  }


  /* NAV */

  .cp-pc-nav {
    border-top: 1px solid #EAECF0;
    border-bottom: 1px solid #EAECF0;

    background: #fff;
  }

  .cp-pc-nav-inner {
    width: calc(100% - 48px);
    max-width: 1200px;
    height: 48px;

    margin: 0 auto;

    display: flex;
    align-items: center;

    gap: 34px;
  }

  .cp-pc-nav-inner a {
    position: relative;

    height: 48px;

    display: flex;
    align-items: center;

    color: #344054 !important;

    font-size: 13px;
    font-weight: 600;
  }

  .cp-pc-nav-inner a::after {
    content: "";

    position: absolute;

    right: 0;
    bottom: 0;
    left: 0;

    height: 2px;

    background: #1261A0;

    transform: scaleX(0);

    transition: transform .2s ease;
  }

  .cp-pc-nav-inner a:hover {
    color: #1261A0 !important;
  }

  .cp-pc-nav-inner a:hover::after {
    transform: scaleX(1);
  }

}

/* =========================================================
   CARPIKAL SP MENU
   悩み・部位から探す
========================================================= */

@media screen and (max-width: 959px) {

  .cp-sp-drawer-nav-purpose {
    margin-bottom: 8px;

    padding: 15px 14px !important;

    background: #fff !important;

    border: 1px solid #D9E5F0 !important;
    border-radius: 9px !important;
  }

  .cp-sp-drawer-nav-purpose strong {
    display: block;

    color: #102A43;

    font-size: 15px;
    font-weight: 700;
  }

  .cp-sp-drawer-nav-purpose small {
    display: block;

    margin-top: 3px;

    color: #667085;

    font-size: 11px;
  }

}

/* =========================================================
   CARPIKAL JAPAN 2026
   GLOBAL FOOTER
========================================================= */

.cp-footer {
  width: 100%;
  margin: 80px 0 0;
  padding: 0;

  background: #102A43;

  color: #fff;

  font-family:
    "Noto Sans JP",
    "Noto Sans Japanese",
    "Yu Gothic",
    "游ゴシック体",
    "メイリオ",
    sans-serif;
}

.cp-footer *,
.cp-footer *::before,
.cp-footer *::after {
  box-sizing: border-box;
}

.cp-footer a {
  text-decoration: none !important;
}


/* =========================================
   BRAND
========================================= */

.cp-footer-brand {
  background: #fff;
  border-top: 1px solid #E4E7EC;
  border-bottom: 1px solid #E4E7EC;
}

.cp-footer-brand-inner {
  width: calc(100% - 48px);
  max-width: 1200px;

  min-height: 112px;

  margin: 0 auto;

  display: flex;
  align-items: center;

  gap: 32px;
}

.cp-footer-logo {
  flex: 0 0 auto;
}

.cp-footer-logo img {
  display: block;

  width: 190px;
  height: auto;
}

.cp-footer-brand-copy {
  display: flex;
  flex-direction: column;

  gap: 4px;
}

.cp-footer-brand-copy strong {
  color: #1E3A5F;

  font-size: 12px;
  letter-spacing: .10em;
}

.cp-footer-brand-copy p {
  margin: 0;

  color: #667085;

  font-size: 13px;
}

.cp-footer-contact {
  min-width: 170px;
  height: 46px;

  margin-left: auto;
  padding: 0 16px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  background: #1261A0;

  border-radius: 8px;

  color: #fff !important;

  font-size: 13px;
  font-weight: 700;
}

.cp-footer-contact:hover {
  background: #0E548C;
}

.cp-footer-contact span {
  font-size: 22px;
  font-weight: 300;
}


/* =========================================
   PC NAV
========================================= */

.cp-footer-nav--pc {
  width: calc(100% - 48px);
  max-width: 1200px;

  margin: 0 auto;
  padding: 48px 0 44px;

  display: grid;

  grid-template-columns:
    repeat(4, minmax(0, 1fr));

  gap: 50px;
}

.cp-footer-nav-column h3 {
  margin: 0 0 18px;

  color: #fff;

  font-size: 14px;
  font-weight: 700;
}

.cp-footer-nav-column a {
  display: block;

  margin: 0 0 11px;

  color: rgba(255,255,255,.72) !important;

  font-size: 12px;
  line-height: 1.6;

  transition: color .2s ease;
}

.cp-footer-nav-column a:hover {
  color: #fff !important;
}


/* =========================================
   SP NAV
========================================= */

.cp-footer-nav--sp {
  display: none;
}


/* =========================================
   BOTTOM
========================================= */

.cp-footer-bottom {
  border-top: 1px solid rgba(255,255,255,.12);

  background: #0B2239;
}

.cp-footer-bottom-inner {
  width: calc(100% - 48px);
  max-width: 1200px;

  min-height: 62px;

  margin: 0 auto;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 24px;
}

.cp-footer-bottom-links {
  display: flex;

  gap: 22px;
}

.cp-footer-bottom-links a {
  color: rgba(255,255,255,.64) !important;

  font-size: 10px;
}

.cp-footer-copyright {
  margin: 0;

  color: rgba(255,255,255,.52);

  font-size: 10px;
}


/* =========================================================
   SMARTPHONE / TABLET
========================================================= */

@media screen and (max-width: 959px) {

  .cp-footer {
    margin-top: 52px;
  }


  /* BRAND */

  .cp-footer-brand-inner {
    width: calc(100% - 32px);

    min-height: 0;

    padding: 28px 0;

    flex-wrap: wrap;

    gap: 16px;
  }

  .cp-footer-logo img {
    width: 155px;
    max-width: 48vw;
  }

  .cp-footer-brand-copy {
    flex: 1 1 150px;
  }

  .cp-footer-brand-copy strong {
    font-size: 10px;
  }

  .cp-footer-brand-copy p {
    font-size: 11px;
    line-height: 1.6;
  }

  .cp-footer-contact {
    width: 100%;
    min-width: 0;

    margin: 4px 0 0;
  }


  /* PC NAV OFF */

  .cp-footer-nav--pc {
    display: none;
  }


  /* SP NAV */

  .cp-footer-nav--sp {
    display: block;

    width: calc(100% - 32px);

    margin: 0 auto;
    padding: 14px 0 26px;
  }

  .cp-footer-nav--sp details {
    margin: 0;

    border-bottom: 1px solid rgba(255,255,255,.14);
  }

  .cp-footer-nav--sp summary {
    min-height: 54px;

    display: flex;

    align-items: center;
    justify-content: space-between;

    color: #fff;

    font-size: 13px;
    font-weight: 700;

    cursor: pointer;

    list-style: none;
  }

  .cp-footer-nav--sp summary::-webkit-details-marker {
    display: none;
  }

  .cp-footer-nav--sp summary::after {
    content: "+";

    color: rgba(255,255,255,.55);

    font-size: 20px;
    font-weight: 300;
  }

  .cp-footer-nav--sp details[open] summary::after {
    content: "−";
  }

  .cp-footer-nav--sp details > div {
    padding: 0 0 12px;
  }

  .cp-footer-nav--sp details a {
    display: block;

    padding: 8px 6px;

    color: rgba(255,255,255,.68) !important;

    font-size: 12px;
  }


  /* BOTTOM */

  .cp-footer-bottom-inner {
    width: calc(100% - 32px);

    min-height: 0;

    padding: 20px 0 24px;

    flex-direction: column;

    align-items: flex-start;

    gap: 14px;
  }

  .cp-footer-bottom-links {
    width: 100%;

    flex-wrap: wrap;

    gap: 8px 18px;
  }

  .cp-footer-copyright {
    line-height: 1.6;
  }

}

/* =========================================================
   CARPIKAL JAPAN 2026
   SHOPPING GUIDE
========================================================= */

.cp-guide {
  width: calc(100% - 40px);
  max-width: 1040px;

  margin: 0 auto;
  padding: 48px 0 30px;

  color: #1F2937;

  font-family:
    "Noto Sans JP",
    "Noto Sans Japanese",
    "Yu Gothic",
    "游ゴシック体",
    "メイリオ",
    sans-serif;
}

.cp-guide *,
.cp-guide *::before,
.cp-guide *::after {
  box-sizing: border-box;
}

.cp-guide a {
  text-decoration: none;
}

.cp-guide-anchor {
  display: block;
  position: relative;
  top: -90px;
  visibility: hidden;
}


/* ===============================
   HERO
================================ */

.cp-guide-hero {
  padding-bottom: 56px;
}

.cp-guide-eyebrow {
  margin: 0 0 8px;

  color: #1261A0;

  font-size: 11px;
  font-weight: 700;

  letter-spacing: .14em;
}

.cp-guide-hero h1 {
  margin: 0;

  color: #102A43;

  font-size: 36px;
  font-weight: 700;
  line-height: 1.35;
}

.cp-guide-lead {
  max-width: 640px;

  margin: 16px 0 30px;

  color: #667085;

  font-size: 14px;
  line-height: 1.8;
}


/* MENU */

.cp-guide-menu {
  display: grid;

  grid-template-columns:
    repeat(4, minmax(0, 1fr));

  gap: 12px;
}

.cp-guide-menu a {
  min-height: 132px;

  padding: 18px;

  display: flex;
  flex-direction: column;

  background: #fff;

  border: 1px solid #E4E7EC;
  border-radius: 11px;

  transition:
    border-color .2s ease,
    box-shadow .2s ease,
    transform .2s ease;
}

.cp-guide-menu a:hover {
  border-color: #B8CDE0;

  box-shadow:
    0 7px 20px rgba(16,42,67,.07);

  transform: translateY(-2px);
}

.cp-guide-menu a > span {
  color: #1261A0;

  font-size: 11px;
  font-weight: 700;

  letter-spacing: .10em;
}

.cp-guide-menu strong {
  margin-top: 12px;

  color: #102A43;

  font-size: 15px;
}

.cp-guide-menu small {
  margin-top: 5px;

  color: #98A2B3;

  font-size: 10px;
  line-height: 1.5;
}


/* ===============================
   SECTION
================================ */

.cp-guide-section {
  padding: 58px 0;

  border-top: 1px solid #EAECF0;

  scroll-margin-top: 30px;
}

.cp-guide-section-head {
  margin-bottom: 26px;

  display: flex;
  align-items: center;

  gap: 15px;
}

.cp-guide-section-head > span {
  width: 46px;
  height: 46px;

  flex: 0 0 46px;

  display: flex;

  align-items: center;
  justify-content: center;

  background: #1E3A5F;

  border-radius: 50%;

  color: #fff;

  font-size: 12px;
  font-weight: 700;
}

.cp-guide-section-head p {
  margin: 0 0 2px;

  color: #98A2B3;

  font-size: 9px;
  font-weight: 700;

  letter-spacing: .14em;
}

.cp-guide-section-head h2 {
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;

  color: #102A43 !important;

  font-size: 25px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}


/* ===============================
   CARDS
================================ */

.cp-guide-card {
  margin-bottom: 18px;
  padding: 25px 27px;

  background: #fff;

  border: 1px solid #E4E7EC;
  border-radius: 11px;
}

.cp-guide-card h3,
.cp-guide-payment-card h3 {
  margin: 0 0 12px;

  color: #102A43;

  font-size: 17px;
  font-weight: 700;
}

.cp-guide-card p,
.cp-guide-payment-card p {
  margin: 0 0 10px;

  color: #475467;

  font-size: 13px;
  line-height: 1.85;
}


/* HIGHLIGHT */

.cp-guide-highlight {
  margin: 20px 0;
  padding: 18px 20px;

  background: #EEF4FA;

  border-left: 4px solid #1261A0;
  border-radius: 0 8px 8px 0;
}

.cp-guide-highlight strong {
  display: block;

  color: #1261A0;

  font-size: 22px;
}

.cp-guide-highlight p {
  margin: 5px 0 0;

  color: #344054;

  font-size: 13px;
}


/* LIST */

.cp-guide-list {
  margin: 18px 0 0;
  padding: 0;

  list-style: none;
}

.cp-guide-list li {
  position: relative;

  margin-bottom: 10px;
  padding-left: 19px;

  color: #475467;

  font-size: 13px;
  line-height: 1.75;
}

.cp-guide-list li::before {
  content: "✓";

  position: absolute;

  top: 0;
  left: 0;

  color: #1261A0;

  font-weight: 700;
}


/* ===============================
   MINI CARD / NOTE
================================ */

.cp-guide-mini-card,
.cp-guide-note {
  padding: 20px 22px;

  background: #F8FAFC;

  border-radius: 9px;
}

.cp-guide-mini-card strong,
.cp-guide-note strong {
  display: block;

  margin-bottom: 5px;

  color: #102A43;

  font-size: 14px;
}

.cp-guide-mini-card p,
.cp-guide-note p {
  margin: 4px 0;

  color: #667085;

  font-size: 12px;
  line-height: 1.7;
}

.cp-guide-mini-card a,
.cp-guide-note a {
  display: inline-block;

  margin-top: 7px;

  color: #1261A0 !important;

  font-size: 12px;
  font-weight: 600;
}


/* ===============================
   FREE SHIPPING
================================ */

.cp-guide-free-shipping {
  margin-bottom: 18px;
  padding: 28px;

  background:
    linear-gradient(
      135deg,
      #102A43,
      #1E4F79
    );

  border-radius: 12px;

  color: #fff;
}

.cp-guide-free-shipping small {
  display: block;

  color: rgba(255,255,255,.65);

  font-size: 9px;
  font-weight: 700;

  letter-spacing: .16em;
}

.cp-guide-free-shipping strong {
  display: block;

  margin-top: 8px;

  font-size: 26px;
  line-height: 1.4;
}

.cp-guide-free-shipping p {
  margin: 10px 0 0;

  color: rgba(255,255,255,.78);

  font-size: 12px;
}


/* SURCHARGE */

.cp-guide-surcharge {
  margin-bottom: 18px;

  display: grid;

  grid-template-columns:
    repeat(3, minmax(0,1fr));

  gap: 10px;
}

.cp-guide-surcharge > div {
  padding: 18px;

  display: flex;
  flex-direction: column;

  background: #fff;

  border: 1px solid #E4E7EC;
  border-radius: 9px;
}

.cp-guide-surcharge span {
  color: #667085;

  font-size: 12px;
}

.cp-guide-surcharge strong {
  margin-top: 5px;

  color: #102A43;

  font-size: 20px;
}

.cp-guide-surcharge small {
  margin-top: 6px;

  color: #98A2B3;

  font-size: 9px;
  line-height: 1.6;
}


/* ===============================
   PAYMENT
================================ */

.cp-guide-payment-grid {
  display: grid;

  grid-template-columns:
    repeat(2, minmax(0,1fr));

  gap: 14px;
}

.cp-guide-payment-card {
  padding: 24px;

  background: #fff;

  border: 1px solid #E4E7EC;
  border-radius: 10px;
}

.cp-guide-subtext {
  color: #98A2B3 !important;

  font-size: 11px !important;
}

.cp-guide-bank {
  margin-top: 12px;
  padding: 15px;

  background: #F8FAFC;

  border-radius: 7px;
}

.cp-guide-bank strong {
  color: #102A43;

  font-size: 13px;
}

.cp-guide-bank p {
  margin: 6px 0 0;

  color: #475467;

  font-size: 12px;
  line-height: 1.8;
}


/* ===============================
   TABLE
================================ */

.cp-guide-table-wrap {
  width: 100%;

  margin-top: 16px;

  overflow-x: auto;
}

.cp-guide-table {
  width: 100%;

  border-collapse: collapse;

  background: #fff;

  font-size: 12px;
}

.cp-guide-table th,
.cp-guide-table td {
  padding: 12px 14px;

  border: 1px solid #E4E7EC;

  text-align: left;
}

.cp-guide-table th {
  background: #F8FAFC;

  color: #344054;

  font-weight: 700;
}

.cp-guide-table td {
  color: #475467;
}

.cp-guide-rank-table td:last-child {
  color: #1261A0;

  font-weight: 700;
}


/* ===============================
   SUBHEADING / TEXT
================================ */

.cp-guide-subheading {
  margin: 34px 0 8px;

  color: #102A43;

  font-size: 19px;
}

.cp-guide-text {
  margin: 0 0 16px;

  color: #667085;

  font-size: 13px;
  line-height: 1.8;
}


/* ===============================
   WARNING
================================ */

.cp-guide-warning {
  padding: 24px 26px;

  background: #FFF8ED;

  border: 1px solid #FEDF89;
  border-radius: 10px;
}

.cp-guide-warning + .cp-guide-warning {
  margin-top: 18px;
}

.cp-guide-warning h3 {
  margin: 0 0 12px;

  color: #7A2E0E;

  font-size: 16px;
}

.cp-guide-warning p {
  margin: 6px 0;

  color: #69481F;

  font-size: 12px;
  line-height: 1.8;
}


/* ===============================
   LINKS
================================ */

.cp-guide-primary-link {
  min-height: 46px;

  margin-top: 12px;
  padding: 0 20px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  background: #1261A0;

  border-radius: 8px;

  color: #fff !important;

  font-size: 13px;
  font-weight: 700;
}

.cp-guide-primary-link:hover {
  background: #0E548C;
}

.cp-guide-secondary-link {
  min-height: 46px;

  padding: 0 20px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  background: #fff;

  border: 1px solid #D0D5DD;
  border-radius: 8px;

  color: #344054 !important;

  font-size: 13px;
  font-weight: 600;
}


/* ===============================
   BOTTOM
================================ */

.cp-guide-bottom {
  margin-top: 20px;
  padding: 42px;

  background: #EEF4FA;

  border-radius: 14px;

  text-align: center;
}

.cp-guide-bottom h2 {
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;

  color: #102A43 !important;

  font-size: 23px !important;
}

.cp-guide-bottom > p {
  margin: 10px 0 20px;

  color: #667085;

  font-size: 13px;
}

.cp-guide-bottom > div {
  display: flex;

  justify-content: center;

  gap: 10px;
}


/* =========================================================
   MOBILE
========================================================= */

@media screen and (max-width: 767px) {

  .cp-guide {
    width: calc(100% - 28px);

    padding-top: 30px;
  }


  .cp-guide-hero {
    padding-bottom: 40px;
  }

  .cp-guide-hero h1 {
    font-size: 28px;
  }

  .cp-guide-lead {
    margin-bottom: 22px;

    font-size: 13px;
  }


  .cp-guide-menu {
    grid-template-columns:
      repeat(2, minmax(0,1fr));

    gap: 8px;
  }

  .cp-guide-menu a {
    min-height: 115px;

    padding: 14px;
  }

  .cp-guide-menu strong {
    margin-top: 9px;

    font-size: 13px;
  }

  .cp-guide-menu small {
    font-size: 9px;
  }


  .cp-guide-section {
    padding: 42px 0;
  }

  .cp-guide-section-head {
    margin-bottom: 20px;

    gap: 11px;
  }

  .cp-guide-section-head > span {
    width: 40px;
    height: 40px;

    flex-basis: 40px;
  }

  .cp-guide-section-head h2 {
    font-size: 20px !important;
  }


  .cp-guide-card {
    padding: 20px 18px;
  }

  .cp-guide-highlight {
    padding: 16px;
  }

  .cp-guide-highlight strong {
    font-size: 20px;
  }


  .cp-guide-free-shipping {
    padding: 22px 18px;
  }

  .cp-guide-free-shipping strong {
    font-size: 21px;
  }


  .cp-guide-surcharge {
    grid-template-columns: 1fr;
  }


  .cp-guide-payment-grid {
    grid-template-columns: 1fr;
  }

  .cp-guide-payment-card {
    padding: 20px 18px;
  }


  .cp-guide-table {
    min-width: 500px;
  }


  .cp-guide-warning {
    padding: 20px 18px;
  }


  .cp-guide-primary-link,
  .cp-guide-secondary-link {
    width: 100%;
  }


  .cp-guide-bottom {
    padding: 30px 18px;
  }

  .cp-guide-bottom h2 {
    font-size: 20px !important;
  }

  .cp-guide-bottom > div {
    flex-direction: column;
  }

}

/* =========================================================
   CARPIKAL JAPAN 2026
   CONTACT PAGE
========================================================= */

.cp-contact {
  width: calc(100% - 40px);
  max-width: 1040px;

  margin: 0 auto;
  padding: 48px 0 30px;

  color: #1F2937;

  font-family:
    "Noto Sans JP",
    "Noto Sans Japanese",
    "Yu Gothic",
    "游ゴシック体",
    "メイリオ",
    sans-serif;
}

.cp-contact *,
.cp-contact *::before,
.cp-contact *::after {
  box-sizing: border-box;
}

.cp-contact a {
  text-decoration: none !important;
}


/* HERO */

.cp-contact-hero {
  padding-bottom: 44px;
}

.cp-contact-eyebrow {
  margin: 0 0 8px;

  color: #1261A0;

  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
}

.cp-contact-hero h1 {
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;

  color: #102A43 !important;

  font-size: 36px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

.cp-contact-lead {
  max-width: 650px;

  margin: 16px 0 0;

  color: #667085;

  font-size: 14px;
  line-height: 1.8;
}


/* FAQ / GUIDE */

.cp-contact-support {
  margin-bottom: 56px;
  padding: 30px;

  display: grid;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(0, 1.2fr);

  gap: 34px;

  background: #EEF4FA;

  border-radius: 14px;
}

.cp-contact-support-text > span {
  color: #1261A0;

  font-size: 10px;
  font-weight: 700;
}

.cp-contact-support-text h2 {
  margin: 8px 0 10px !important;
  padding: 0 !important;

  border: 0 !important;

  color: #102A43 !important;

  font-size: 20px !important;
  line-height: 1.5 !important;
}

.cp-contact-support-text p {
  margin: 0;

  color: #667085;

  font-size: 12px;
  line-height: 1.8;
}

.cp-contact-support-links {
  display: grid;

  grid-template-columns:
    repeat(2, minmax(0,1fr));

  gap: 10px;
}

.cp-contact-support-link {
  padding: 18px;

  display: flex;
  flex-direction: column;

  background: #fff;

  border: 1px solid #D9E5F0;
  border-radius: 9px;

  color: #102A43 !important;
}

.cp-contact-support-link strong {
  font-size: 14px;
}

.cp-contact-support-link span {
  margin-top: 7px;

  color: #1261A0;

  font-size: 11px;
}


/* SECTION */

.cp-contact-main {
  padding-bottom: 56px;
}

.cp-contact-section-head {
  margin-bottom: 24px;
}

.cp-contact-section-head > p {
  margin: 0;

  color: #98A2B3;

  font-size: 9px;
  font-weight: 700;
  letter-spacing: .14em;
}

.cp-contact-section-head h2 {
  margin: 3px 0 5px !important;
  padding: 0 !important;

  border: 0 !important;

  color: #102A43 !important;

  font-size: 26px !important;
}

.cp-contact-section-head > span {
  color: #667085;

  font-size: 12px;
}


/* CONTACT CARDS */

.cp-contact-grid {
  display: grid;

  grid-template-columns:
    repeat(2, minmax(0,1fr));

  gap: 12px;
}

.cp-contact-card {
  position: relative;

  min-height: 138px;

  padding: 22px 50px 22px 22px;

  display: grid;

  grid-template-columns:
    44px minmax(0,1fr);

  align-items: start;

  gap: 15px;

  background: #fff;

  border: 1px solid #E4E7EC;
  border-radius: 11px;

  color: #1F2937 !important;

  transition:
    border-color .2s ease,
    box-shadow .2s ease,
    transform .2s ease;
}

.cp-contact-card:hover {
  border-color: #B8CDE0;

  box-shadow:
    0 8px 22px rgba(16,42,67,.07);

  transform: translateY(-2px);
}

.cp-contact-icon {
  width: 44px;
  height: 44px;

  display: flex;

  align-items: center;
  justify-content: center;

  background: #EEF4FA;

  border-radius: 50%;

  color: #1261A0;
}

.cp-contact-icon svg {
  width: 22px;
  height: 22px;

  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.cp-contact-card small {
  display: block;

  margin-bottom: 4px;

  color: #98A2B3;

  font-size: 9px;
  font-weight: 700;

  letter-spacing: .10em;
}

.cp-contact-card strong {
  display: block;

  color: #102A43;

  font-size: 16px;
}

.cp-contact-card p {
  margin: 7px 0 0;

  color: #667085;

  font-size: 11px;
  line-height: 1.65;
}

.cp-contact-arrow {
  position: absolute;

  top: 50%;
  right: 20px;

  color: #98A2B3;

  font-size: 25px;

  transform: translateY(-50%);
}


/* HOURS */

.cp-contact-hours {
  margin-bottom: 18px;
  padding: 24px 26px;

  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 30px;

  background: #102A43;

  border-radius: 11px;

  color: #fff;
}

.cp-contact-hours small {
  display: block;

  margin-bottom: 5px;

  color: rgba(255,255,255,.55);

  font-size: 9px;
  font-weight: 700;

  letter-spacing: .12em;
}

.cp-contact-hours strong {
  font-size: 16px;
}

.cp-contact-hours p {
  margin: 0;

  color: rgba(255,255,255,.80);

  font-size: 12px;
  line-height: 1.8;
}

.cp-contact-hours p b {
  color: #fff;

  font-size: 15px;
}


/* BOTTOM CTA */

.cp-contact-bottom {
  padding: 38px;

  background: #F8FAFC;

  border: 1px solid #EAECF0;
  border-radius: 13px;

  text-align: center;
}

.cp-contact-bottom h2 {
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;

  color: #102A43 !important;

  font-size: 21px !important;
}

.cp-contact-bottom p {
  max-width: 600px;

  margin: 12px auto 20px;

  color: #667085;

  font-size: 12px;
  line-height: 1.8;
}

.cp-contact-primary {
  min-height: 48px;

  padding: 0 25px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  background: #1261A0;

  border-radius: 8px;

  color: #fff !important;

  font-size: 13px;
  font-weight: 700;
}

.cp-contact-primary:hover {
  background: #0E548C;
}


/* =========================================================
   MOBILE
========================================================= */

@media screen and (max-width: 767px) {

  .cp-contact {
    width: calc(100% - 28px);

    padding-top: 30px;
  }

  .cp-contact-hero {
    padding-bottom: 32px;
  }

  .cp-contact-hero h1 {
    font-size: 28px !important;
  }

  .cp-contact-lead {
    font-size: 13px;
  }


  .cp-contact-support {
    margin-bottom: 42px;
    padding: 20px 17px;

    grid-template-columns: 1fr;

    gap: 18px;
  }

  .cp-contact-support-text h2 {
    font-size: 18px !important;
  }

  .cp-contact-support-links {
    grid-template-columns: 1fr;
  }


  .cp-contact-main {
    padding-bottom: 42px;
  }

  .cp-contact-section-head h2 {
    font-size: 21px !important;
  }


  .cp-contact-grid {
    grid-template-columns: 1fr;
  }

  .cp-contact-card {
    min-height: 0;

    padding: 18px 43px 18px 16px;

    grid-template-columns:
      40px minmax(0,1fr);

    gap: 12px;
  }

  .cp-contact-icon {
    width: 40px;
    height: 40px;
  }

  .cp-contact-card strong {
    font-size: 14px;
  }


  .cp-contact-hours {
    padding: 20px 18px;

    flex-direction: column;

    align-items: flex-start;

    gap: 12px;
  }


  .cp-contact-bottom {
    padding: 28px 18px;
  }

  .cp-contact-bottom h2 {
    font-size: 19px !important;
  }

  .cp-contact-primary {
    width: 100%;
  }

}

/* =========================================================
   CARPIKAL JAPAN 2026
   BEGINNER PAGE
========================================================= */

.cp-beginner {
  width: calc(100% - 40px);
  max-width: 1040px;

  margin: 0 auto;
  padding: 52px 0 30px;

  color: #1F2937;

  font-family:
    "Noto Sans JP",
    "Noto Sans Japanese",
    "Yu Gothic",
    "游ゴシック体",
    "メイリオ",
    sans-serif;
}

.cp-beginner *,
.cp-beginner *::before,
.cp-beginner *::after {
  box-sizing: border-box;
}

.cp-beginner a {
  text-decoration: none !important;
}


/* =========================================
   HERO
========================================= */

.cp-beginner-hero {
  padding: 20px 0 64px;
}

.cp-beginner-eyebrow {
  margin: 0 0 8px;

  color: #1261A0;

  font-size: 10px;
  font-weight: 700;

  letter-spacing: .16em;
}

.cp-beginner-hero h1 {
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;

  color: #102A43 !important;

  font-size: 38px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}

.cp-beginner-catch {
  margin: 26px 0 15px;

  color: #102A43;

  font-size: 29px;
  font-weight: 700;
  line-height: 1.55;
}

.cp-beginner-lead {
  max-width: 720px;

  margin: 0;

  color: #667085;

  font-size: 14px;
  line-height: 1.9;
}

.cp-beginner-hero-actions {
  margin-top: 28px;

  display: flex;

  gap: 10px;
}


/* =========================================
   BUTTONS
========================================= */

.cp-beginner-primary,
.cp-beginner-secondary {
  min-height: 48px;

  padding: 0 22px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  border-radius: 8px;

  font-size: 13px;
  font-weight: 700;
}

.cp-beginner-primary {
  background: #1261A0;

  color: #fff !important;
}

.cp-beginner-primary:hover {
  background: #0E548C;
}

.cp-beginner-secondary {
  background: #fff;

  border: 1px solid #D0D5DD;

  color: #344054 !important;
}


/* =========================================
   SECTION
========================================= */

.cp-beginner-section {
  padding: 60px 0;

  border-top: 1px solid #EAECF0;
}

.cp-beginner-section-title {
  margin-bottom: 28px;
}

.cp-beginner-section-title p {
  margin: 0 0 4px;

  color: #98A2B3;

  font-size: 9px;
  font-weight: 700;

  letter-spacing: .16em;
}

.cp-beginner-section-title h2 {
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;

  color: #102A43 !important;

  font-size: 27px !important;
}


/* =========================================
   FEATURES
========================================= */

.cp-beginner-feature-grid {
  display: grid;

  grid-template-columns:
    repeat(3, minmax(0,1fr));

  gap: 14px;
}

.cp-beginner-feature {
  min-height: 235px;

  padding: 25px;

  background: #fff;

  border: 1px solid #E4E7EC;
  border-radius: 11px;
}

.cp-beginner-feature > span {
  display: block;

  color: #1261A0;

  font-size: 11px;
  font-weight: 700;

  letter-spacing: .10em;
}

.cp-beginner-feature strong {
  display: block;

  margin: 18px 0 10px;

  color: #102A43;

  font-size: 18px;
}

.cp-beginner-feature p {
  margin: 0;

  color: #667085;

  font-size: 12px;
  line-height: 1.9;
}


/* =========================================
   PRO
========================================= */

.cp-beginner-pro {
  margin: 20px 0;
  padding: 48px;

  background:
    linear-gradient(
      135deg,
      #102A43,
      #1C4A72
    );

  border-radius: 14px;

  color: #fff;
}

.cp-beginner-pro-content {
  max-width: 700px;
}

.cp-beginner-pro .cp-beginner-eyebrow {
  color: #90CAF2;
}

.cp-beginner-pro h2 {
  margin: 6px 0 20px !important;
  padding: 0 !important;

  border: 0 !important;

  color: #fff !important;

  font-size: 27px !important;
  line-height: 1.55 !important;
}

.cp-beginner-pro p {
  margin: 9px 0;

  color: rgba(255,255,255,.78);

  font-size: 13px;
  line-height: 1.9;
}

.cp-beginner-pro p strong {
  color: #fff;
}

.cp-beginner-text-link {
  display: inline-block;

  margin-top: 17px;

  color: #fff !important;

  font-size: 12px;
  font-weight: 700;

  text-decoration: underline !important;

  text-underline-offset: 4px;
}


/* =========================================
   STEPS
========================================= */

.cp-beginner-steps {
  display: grid;

  gap: 11px;
}

.cp-beginner-step {
  padding: 21px 23px;

  display: grid;

  grid-template-columns:
    45px minmax(0,1fr);

  gap: 17px;

  background: #fff;

  border: 1px solid #E4E7EC;
  border-radius: 10px;
}

.cp-beginner-step-number {
  width: 45px;
  height: 45px;

  display: flex;

  align-items: center;
  justify-content: center;

  background: #EEF4FA;

  border-radius: 50%;

  color: #1261A0;

  font-size: 14px;
  font-weight: 700;
}

.cp-beginner-step strong {
  color: #102A43;

  font-size: 16px;
}

.cp-beginner-step p {
  margin: 7px 0 0;

  color: #667085;

  font-size: 12px;
  line-height: 1.8;
}

.cp-beginner-step a {
  display: inline-block;

  margin-top: 8px;

  color: #1261A0 !important;

  font-size: 12px;
  font-weight: 600;
}


/* =========================================
   SHOP
========================================= */

.cp-beginner-shop-grid {
  display: grid;

  grid-template-columns:
    repeat(2, minmax(0,1fr));

  gap: 12px;
}

.cp-beginner-shop-card {
  padding: 23px;

  background: #F8FAFC;

  border: 1px solid #EAECF0;
  border-radius: 10px;
}

.cp-beginner-shop-card > span {
  display: inline-block;

  padding: 4px 8px;

  background: #EEF4FA;

  border-radius: 5px;

  color: #1261A0;

  font-size: 10px;
  font-weight: 700;
}

.cp-beginner-shop-card strong {
  display: block;

  margin-top: 13px;

  color: #102A43;

  font-size: 19px;
}

.cp-beginner-shop-card p {
  margin: 9px 0 0;

  color: #475467;

  font-size: 12px;
  line-height: 1.8;
}

.cp-beginner-shop-card small {
  display: block;

  margin-top: 8px;

  color: #98A2B3;

  font-size: 10px;
  line-height: 1.7;
}

.cp-beginner-guide-link {
  min-height: 52px;

  margin-top: 13px;
  padding: 0 18px;

  display: flex;

  align-items: center;
  justify-content: space-between;

  background: #fff;

  border: 1px solid #D0D5DD;
  border-radius: 8px;

  color: #344054 !important;

  font-size: 12px;
  font-weight: 600;
}

.cp-beginner-guide-link span {
  color: #98A2B3;

  font-size: 22px;
}


/* =========================================
   SUPPORT
========================================= */

.cp-beginner-support {
  margin-top: 20px;
  padding: 38px;

  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 40px;

  background: #EEF4FA;

  border-radius: 13px;
}

.cp-beginner-support > div:first-child {
  max-width: 630px;
}

.cp-beginner-support h2 {
  margin: 3px 0 10px !important;
  padding: 0 !important;

  border: 0 !important;

  color: #102A43 !important;

  font-size: 22px !important;
  line-height: 1.55 !important;
}

.cp-beginner-support p {
  margin: 0;

  color: #667085;

  font-size: 12px;
  line-height: 1.8;
}

.cp-beginner-support-actions {
  flex: 0 0 auto;

  display: flex;

  flex-direction: column;

  gap: 8px;
}


/* =========================================
   BOTTOM
========================================= */

.cp-beginner-bottom {
  margin-top: 60px;
  padding: 55px 35px;

  background: #102A43;

  border-radius: 14px;

  text-align: center;
}

.cp-beginner-bottom > p {
  margin: 0 0 8px;

  color: rgba(255,255,255,.52);

  font-size: 9px;
  font-weight: 700;

  letter-spacing: .16em;
}

.cp-beginner-bottom h2 {
  max-width: 660px;

  margin: 0 auto 24px !important;
  padding: 0 !important;

  border: 0 !important;

  color: #fff !important;

  font-size: 24px !important;
  line-height: 1.55 !important;
}


/* =========================================================
   MOBILE
========================================================= */

@media screen and (max-width: 767px) {

  .cp-beginner {
    width: calc(100% - 28px);

    padding-top: 30px;
  }


  .cp-beginner-hero {
    padding: 10px 0 42px;
  }

  .cp-beginner-hero h1 {
    font-size: 28px !important;
  }

  .cp-beginner-catch {
    margin-top: 20px;

    font-size: 22px;
  }

  .cp-beginner-lead {
    font-size: 13px;
  }

  .cp-beginner-hero-actions {
    flex-direction: column;
  }

  .cp-beginner-primary,
  .cp-beginner-secondary {
    width: 100%;
  }


  .cp-beginner-section {
    padding: 42px 0;
  }

  .cp-beginner-section-title h2 {
    font-size: 21px !important;
  }


  .cp-beginner-feature-grid {
    grid-template-columns: 1fr;
  }

  .cp-beginner-feature {
    min-height: 0;

    padding: 21px 18px;
  }


  .cp-beginner-pro {
    margin: 10px 0;
    padding: 28px 20px;
  }

  .cp-beginner-pro h2 {
    font-size: 21px !important;
  }


  .cp-beginner-step {
    padding: 18px 16px;

    grid-template-columns:
      38px minmax(0,1fr);

    gap: 12px;
  }

  .cp-beginner-step-number {
    width: 38px;
    height: 38px;
  }

  .cp-beginner-step strong {
    font-size: 14px;
  }


  .cp-beginner-shop-grid {
    grid-template-columns: 1fr;
  }

  .cp-beginner-shop-card {
    padding: 20px 17px;
  }


  .cp-beginner-support {
    padding: 28px 18px;

    flex-direction: column;

    align-items: stretch;

    gap: 22px;
  }

  .cp-beginner-support h2 {
    font-size: 20px !important;
  }


  .cp-beginner-bottom {
    margin-top: 42px;
    padding: 36px 18px;
  }

  .cp-beginner-bottom h2 {
    font-size: 20px !important;
  }

}

/* =========================================================
   CARPIKAL JAPAN 2026
   BEGINNER PAGE
========================================================= */

.cp-beginner {
  width: calc(100% - 40px);
  max-width: 1040px;

  margin: 0 auto;
  padding: 52px 0 30px;

  color: #1F2937;

  font-family:
    "Noto Sans JP",
    "Noto Sans Japanese",
    "Yu Gothic",
    "游ゴシック体",
    "メイリオ",
    sans-serif;
}

.cp-beginner *,
.cp-beginner *::before,
.cp-beginner *::after {
  box-sizing: border-box;
}

.cp-beginner a {
  text-decoration: none !important;
}


/* =========================================
   HERO
========================================= */

.cp-beginner-hero {
  padding: 20px 0 64px;
}

.cp-beginner-eyebrow {
  margin: 0 0 8px;

  color: #1261A0;

  font-size: 10px;
  font-weight: 700;

  letter-spacing: .16em;
}

.cp-beginner-hero h1 {
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;

  color: #102A43 !important;

  font-size: 38px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}

.cp-beginner-catch {
  margin: 26px 0 15px;

  color: #102A43;

  font-size: 29px;
  font-weight: 700;
  line-height: 1.55;
}

.cp-beginner-lead {
  max-width: 720px;

  margin: 0;

  color: #667085;

  font-size: 14px;
  line-height: 1.9;
}

.cp-beginner-hero-actions {
  margin-top: 28px;

  display: flex;

  gap: 10px;
}


/* =========================================
   BUTTONS
========================================= */

.cp-beginner-primary,
.cp-beginner-secondary {
  min-height: 48px;

  padding: 0 22px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  border-radius: 8px;

  font-size: 13px;
  font-weight: 700;
}

.cp-beginner-primary {
  background: #1261A0;

  color: #fff !important;
}

.cp-beginner-primary:hover {
  background: #0E548C;
}

.cp-beginner-secondary {
  background: #fff;

  border: 1px solid #D0D5DD;

  color: #344054 !important;
}


/* =========================================
   SECTION
========================================= */

.cp-beginner-section {
  padding: 60px 0;

  border-top: 1px solid #EAECF0;
}

.cp-beginner-section-title {
  margin-bottom: 28px;
}

.cp-beginner-section-title p {
  margin: 0 0 4px;

  color: #98A2B3;

  font-size: 9px;
  font-weight: 700;

  letter-spacing: .16em;
}

.cp-beginner-section-title h2 {
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;

  color: #102A43 !important;

  font-size: 27px !important;
}


/* =========================================
   FEATURES
========================================= */

.cp-beginner-feature-grid {
  display: grid;

  grid-template-columns:
    repeat(3, minmax(0,1fr));

  gap: 14px;
}

.cp-beginner-feature {
  min-height: 235px;

  padding: 25px;

  background: #fff;

  border: 1px solid #E4E7EC;
  border-radius: 11px;
}

.cp-beginner-feature > span {
  display: block;

  color: #1261A0;

  font-size: 11px;
  font-weight: 700;

  letter-spacing: .10em;
}

.cp-beginner-feature strong {
  display: block;

  margin: 18px 0 10px;

  color: #102A43;

  font-size: 18px;
}

.cp-beginner-feature p {
  margin: 0;

  color: #667085;

  font-size: 12px;
  line-height: 1.9;
}


/* =========================================
   PROFESSIONAL PRODUCTS
========================================= */

.cp-beginner-pro {
  margin: 20px 0;
  padding: 48px;

  background:
    linear-gradient(
      135deg,
      #102A43,
      #1C4A72
    );

  border-radius: 14px;

  color: #fff;
}

.cp-beginner-pro-content {
  max-width: 700px;
}

.cp-beginner-pro .cp-beginner-eyebrow {
  color: #90CAF2;
}

.cp-beginner-pro h2 {
  margin: 6px 0 20px !important;
  padding: 0 !important;

  border: 0 !important;

  color: #fff !important;

  font-size: 27px !important;
  line-height: 1.55 !important;
}

.cp-beginner-pro p {
  margin: 9px 0;

  color: rgba(255,255,255,.78);

  font-size: 13px;
  line-height: 1.9;
}

.cp-beginner-pro p strong {
  color: #fff;
}

.cp-beginner-text-link {
  display: inline-block;

  margin-top: 17px;

  color: #fff !important;

  font-size: 12px;
  font-weight: 700;

  text-decoration: underline !important;

  text-underline-offset: 4px;
}


/* =========================================
   STEPS
========================================= */

.cp-beginner-steps {
  display: grid;

  gap: 11px;
}

.cp-beginner-step {
  padding: 21px 23px;

  display: grid;

  grid-template-columns:
    45px minmax(0,1fr);

  gap: 17px;

  background: #fff;

  border: 1px solid #E4E7EC;
  border-radius: 10px;
}

.cp-beginner-step-number {
  width: 45px;
  height: 45px;

  display: flex;

  align-items: center;
  justify-content: center;

  background: #EEF4FA;

  border-radius: 50%;

  color: #1261A0;

  font-size: 14px;
  font-weight: 700;
}

.cp-beginner-step strong {
  color: #102A43;

  font-size: 16px;
}

.cp-beginner-step p {
  margin: 7px 0 0;

  color: #667085;

  font-size: 12px;
  line-height: 1.8;
}

.cp-beginner-step a {
  display: inline-block;

  margin-top: 8px;

  color: #1261A0 !important;

  font-size: 12px;
  font-weight: 600;
}


/* =========================================
   SHOPPING
========================================= */

.cp-beginner-shop-grid {
  display: grid;

  grid-template-columns:
    repeat(2, minmax(0,1fr));

  gap: 12px;
}

.cp-beginner-shop-card {
  padding: 23px;

  background: #F8FAFC;

  border: 1px solid #EAECF0;
  border-radius: 10px;
}

.cp-beginner-shop-card > span {
  display: inline-block;

  padding: 4px 8px;

  background: #EEF4FA;

  border-radius: 5px;

  color: #1261A0;

  font-size: 10px;
  font-weight: 700;
}

.cp-beginner-shop-card strong {
  display: block;

  margin-top: 13px;

  color: #102A43;

  font-size: 19px;
}

.cp-beginner-shop-card p {
  margin: 9px 0 0;

  color: #475467;

  font-size: 12px;
  line-height: 1.8;
}

.cp-beginner-shop-card small {
  display: block;

  margin-top: 8px;

  color: #98A2B3;

  font-size: 10px;
  line-height: 1.7;
}

.cp-beginner-guide-link {
  min-height: 52px;

  margin-top: 13px;
  padding: 0 18px;

  display: flex;

  align-items: center;
  justify-content: space-between;

  background: #fff;

  border: 1px solid #D0D5DD;
  border-radius: 8px;

  color: #344054 !important;

  font-size: 12px;
  font-weight: 600;
}

.cp-beginner-guide-link span {
  color: #98A2B3;

  font-size: 22px;
}


/* =========================================
   SUPPORT
========================================= */

.cp-beginner-support {
  margin-top: 20px;
  padding: 38px;

  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 40px;

  background: #EEF4FA;

  border-radius: 13px;
}

.cp-beginner-support > div:first-child {
  max-width: 630px;
}

.cp-beginner-support h2 {
  margin: 3px 0 10px !important;
  padding: 0 !important;

  border: 0 !important;

  color: #102A43 !important;

  font-size: 22px !important;
  line-height: 1.55 !important;
}

.cp-beginner-support p {
  margin: 0;

  color: #667085;

  font-size: 12px;
  line-height: 1.8;
}

.cp-beginner-support-actions {
  flex: 0 0 auto;

  display: flex;

  flex-direction: column;

  gap: 8px;
}


/* =========================================
   BOTTOM CTA
========================================= */

.cp-beginner-bottom {
  margin-top: 60px;
  padding: 55px 35px;

  background: #102A43;

  border-radius: 14px;

  text-align: center;
}

.cp-beginner-bottom > p {
  margin: 0 0 8px;

  color: rgba(255,255,255,.52);

  font-size: 9px;
  font-weight: 700;

  letter-spacing: .16em;
}

.cp-beginner-bottom h2 {
  max-width: 660px;

  margin: 0 auto 24px !important;
  padding: 0 !important;

  border: 0 !important;

  color: #fff !important;

  font-size: 24px !important;
  line-height: 1.55 !important;
}


/* =========================================================
   MOBILE
========================================================= */

@media screen and (max-width: 767px) {

  .cp-beginner {
    width: calc(100% - 28px);

    padding-top: 30px;
  }


  .cp-beginner-hero {
    padding: 10px 0 42px;
  }

  .cp-beginner-hero h1 {
    font-size: 28px !important;
  }

  .cp-beginner-catch {
    margin-top: 20px;

    font-size: 22px;
  }

  .cp-beginner-lead {
    font-size: 13px;
  }

  .cp-beginner-hero-actions {
    flex-direction: column;
  }

  .cp-beginner-primary,
  .cp-beginner-secondary {
    width: 100%;
  }


  .cp-beginner-section {
    padding: 42px 0;
  }

  .cp-beginner-section-title h2 {
    font-size: 21px !important;
  }


  .cp-beginner-feature-grid {
    grid-template-columns: 1fr;
  }

  .cp-beginner-feature {
    min-height: 0;

    padding: 21px 18px;
  }


  .cp-beginner-pro {
    margin: 10px 0;
    padding: 28px 20px;
  }

  .cp-beginner-pro h2 {
    font-size: 21px !important;
  }


  .cp-beginner-step {
    padding: 18px 16px;

    grid-template-columns:
      38px minmax(0,1fr);

    gap: 12px;
  }

  .cp-beginner-step-number {
    width: 38px;
    height: 38px;
  }

  .cp-beginner-step strong {
    font-size: 14px;
  }


  .cp-beginner-shop-grid {
    grid-template-columns: 1fr;
  }

  .cp-beginner-shop-card {
    padding: 20px 17px;
  }


  .cp-beginner-support {
    padding: 28px 18px;

    flex-direction: column;

    align-items: stretch;

    gap: 22px;
  }

  .cp-beginner-support h2 {
    font-size: 20px !important;
  }


  .cp-beginner-bottom {
    margin-top: 42px;
    padding: 36px 18px;
  }

  .cp-beginner-bottom h2 {
    font-size: 20px !important;
  }

}

/* =========================================================
   CARPIKAL JAPAN 2026
   FAQ PAGE
========================================================= */

.cp-faq {
  width: calc(100% - 40px);
  max-width: 1040px;

  margin: 0 auto;
  padding: 52px 0 30px;

  color: #1F2937;

  font-family:
    "Noto Sans JP",
    "Noto Sans Japanese",
    "Yu Gothic",
    "游ゴシック体",
    "メイリオ",
    sans-serif;
}

.cp-faq *,
.cp-faq *::before,
.cp-faq *::after {
  box-sizing: border-box;
}

.cp-faq a {
  text-decoration: none !important;
}


/* HERO */

.cp-faq-hero {
  padding: 20px 0 44px;
}

.cp-faq-eyebrow {
  margin: 0 0 8px;

  color: #1261A0;

  font-size: 10px;
  font-weight: 700;

  letter-spacing: .16em;
}

.cp-faq-hero h1 {
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;

  color: #102A43 !important;

  font-size: 38px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}

.cp-faq-lead {
  max-width: 650px;

  margin: 16px 0 0;

  color: #667085;

  font-size: 14px;
  line-height: 1.9;
}


/* CATEGORY NAV */

.cp-faq-nav {
  margin-bottom: 56px;

  display: grid;

  grid-template-columns:
    repeat(5, minmax(0,1fr));

  gap: 8px;
}

.cp-faq-nav a {
  min-height: 88px;

  padding: 14px;

  display: flex;
  flex-direction: column;

  background: #F8FAFC;

  border: 1px solid #EAECF0;
  border-radius: 9px;

  transition:
    background .2s ease,
    border-color .2s ease;
}

.cp-faq-nav a:hover {
  background: #EEF4FA;

  border-color: #C7D7E5;
}

.cp-faq-nav span {
  color: #1261A0;

  font-size: 9px;
  font-weight: 700;
}

.cp-faq-nav strong {
  margin-top: 9px;

  color: #102A43;

  font-size: 12px;
}


/* SECTIONS */

.cp-faq-section {
  padding: 52px 0;

  border-top: 1px solid #EAECF0;

  scroll-margin-top: 30px;
}

.cp-faq-section-head {
  margin-bottom: 22px;

  display: flex;
  align-items: center;

  gap: 14px;
}

.cp-faq-section-head > span {
  width: 44px;
  height: 44px;

  flex: 0 0 44px;

  display: flex;

  align-items: center;
  justify-content: center;

  background: #1E3A5F;

  border-radius: 50%;

  color: #fff;

  font-size: 11px;
  font-weight: 700;
}

.cp-faq-section-head p {
  margin: 0 0 2px;

  color: #98A2B3;

  font-size: 9px;
  font-weight: 700;

  letter-spacing: .14em;
}

.cp-faq-section-head h2 {
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;

  color: #102A43 !important;

  font-size: 24px !important;
}


/* FAQ DETAILS */

.cp-faq-list {
  display: grid;

  gap: 8px;
}

.cp-faq-list details {
  overflow: hidden;

  background: #fff;

  border: 1px solid #E4E7EC;
  border-radius: 9px;
}

.cp-faq-list summary {
  position: relative;

  min-height: 64px;

  padding: 16px 54px 16px 18px;

  display: flex;

  align-items: center;

  gap: 13px;

  color: #102A43;

  font-size: 14px;
  font-weight: 600;

  cursor: pointer;

  list-style: none;
}

.cp-faq-list summary::-webkit-details-marker {
  display: none;
}

.cp-faq-list summary > span {
  flex: 0 0 auto;

  color: #1261A0;

  font-size: 15px;
  font-weight: 700;
}

.cp-faq-list summary::after {
  content: "+";

  position: absolute;

  top: 50%;
  right: 20px;

  color: #98A2B3;

  font-size: 23px;
  font-weight: 300;

  transform: translateY(-50%);
}

.cp-faq-list details[open] summary {
  background: #F8FAFC;
}

.cp-faq-list details[open] summary::after {
  content: "−";
}


/* ANSWER */

.cp-faq-answer {
  padding: 20px 22px;

  display: grid;

  grid-template-columns:
    27px minmax(0,1fr);

  gap: 10px;

  border-top: 1px solid #EAECF0;
}

.cp-faq-answer > span {
  color: #98A2B3;

  font-size: 14px;
  font-weight: 700;
}

.cp-faq-answer p {
  margin: 0 0 10px;

  color: #475467;

  font-size: 13px;
  line-height: 1.85;
}

.cp-faq-answer p:last-child {
  margin-bottom: 0;
}

.cp-faq-answer ul {
  margin: 10px 0;
  padding-left: 20px;

  color: #475467;

  font-size: 13px;
  line-height: 1.9;
}

.cp-faq-answer a {
  display: inline-block;

  margin: 5px 0 10px;

  color: #1261A0 !important;

  font-size: 12px;
  font-weight: 700;
}


/* BANK */

.cp-faq-bank {
  margin: 10px 0;
  padding: 14px 16px;

  background: #F8FAFC;

  border-radius: 7px;
}

.cp-faq-bank strong {
  color: #102A43;

  font-size: 13px;
}

.cp-faq-bank p {
  margin: 5px 0 0;

  font-size: 12px;
}


/* SHIPPING FEE */

.cp-faq-shipping-fee {
  margin: 14px 0;

  display: grid;

  grid-template-columns:
    repeat(3, minmax(0,1fr));

  gap: 8px;
}

.cp-faq-shipping-fee > div {
  padding: 13px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  background: #F8FAFC;

  border-radius: 7px;
}

.cp-faq-shipping-fee span {
  color: #667085;

  font-size: 11px;
}

.cp-faq-shipping-fee strong {
  color: #102A43;

  font-size: 14px;
}


/* BOTTOM */

.cp-faq-bottom {
  margin-top: 58px;
  padding: 44px 30px;

  background: #102A43;

  border-radius: 14px;

  text-align: center;
}

.cp-faq-bottom > p {
  margin: 0 0 7px;

  color: rgba(255,255,255,.50);

  font-size: 9px;
  font-weight: 700;

  letter-spacing: .15em;
}

.cp-faq-bottom h2 {
  margin: 0 auto 22px !important;
  padding: 0 !important;

  border: 0 !important;

  color: #fff !important;

  font-size: 22px !important;
}

.cp-faq-bottom > div {
  display: flex;

  justify-content: center;

  gap: 9px;
}

.cp-faq-primary,
.cp-faq-secondary {
  min-height: 47px;

  padding: 0 22px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  border-radius: 8px;

  font-size: 12px;
  font-weight: 700;
}

.cp-faq-primary {
  background: #1261A0;

  color: #fff !important;
}

.cp-faq-secondary {
  background: #fff;

  color: #344054 !important;
}


/* =========================================================
   MOBILE
========================================================= */

@media screen and (max-width: 767px) {

  .cp-faq {
    width: calc(100% - 28px);

    padding-top: 30px;
  }


  .cp-faq-hero {
    padding: 10px 0 32px;
  }

  .cp-faq-hero h1 {
    font-size: 28px !important;
  }

  .cp-faq-lead {
    font-size: 13px;
  }


  .cp-faq-nav {
    margin-bottom: 42px;

    grid-template-columns:
      repeat(2, minmax(0,1fr));

    gap: 7px;
  }

  .cp-faq-nav a {
    min-height: 72px;

    padding: 12px;
  }


  .cp-faq-section {
    padding: 40px 0;
  }

  .cp-faq-section-head {
    gap: 10px;
  }

  .cp-faq-section-head > span {
    width: 39px;
    height: 39px;

    flex-basis: 39px;
  }

  .cp-faq-section-head h2 {
    font-size: 20px !important;
  }


  .cp-faq-list summary {
    min-height: 60px;

    padding:
      14px 45px
      14px 14px;

    gap: 9px;

    font-size: 13px;
    line-height: 1.6;
  }

  .cp-faq-list summary::after {
    right: 15px;
  }


  .cp-faq-answer {
    padding: 17px 15px;

    grid-template-columns:
      22px minmax(0,1fr);

    gap: 7px;
  }

  .cp-faq-answer p,
  .cp-faq-answer ul {
    font-size: 12px;
  }


  .cp-faq-shipping-fee {
    grid-template-columns: 1fr;
  }


  .cp-faq-bottom {
    margin-top: 42px;
    padding: 32px 17px;
  }

  .cp-faq-bottom h2 {
    font-size: 19px !important;
  }

  .cp-faq-bottom > div {
    flex-direction: column;
  }

  .cp-faq-primary,
  .cp-faq-secondary {
    width: 100%;
  }

}

/* =========================================================
   CARPIKAL JAPAN 2026
   FAQ PAGE
========================================================= */

.cp-faq {
  width: calc(100% - 40px);
  max-width: 1040px;

  margin: 0 auto;
  padding: 52px 0 30px;

  color: #1F2937;

  font-family:
    "Noto Sans JP",
    "Noto Sans Japanese",
    "Yu Gothic",
    "游ゴシック体",
    "メイリオ",
    sans-serif;
}

.cp-faq *,
.cp-faq *::before,
.cp-faq *::after {
  box-sizing: border-box;
}

.cp-faq a {
  text-decoration: none !important;
}


/* HERO */

.cp-faq-hero {
  padding: 20px 0 44px;
}

.cp-faq-eyebrow {
  margin: 0 0 8px;

  color: #1261A0;

  font-size: 10px;
  font-weight: 700;

  letter-spacing: .16em;
}

.cp-faq-hero h1 {
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;

  color: #102A43 !important;

  font-size: 38px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}

.cp-faq-lead {
  max-width: 650px;

  margin: 16px 0 0;

  color: #667085;

  font-size: 14px;
  line-height: 1.9;
}


/* CATEGORY NAV */

.cp-faq-nav {
  margin-bottom: 56px;

  display: grid;

  grid-template-columns:
    repeat(5, minmax(0,1fr));

  gap: 8px;
}

.cp-faq-nav a {
  min-height: 88px;

  padding: 14px;

  display: flex;
  flex-direction: column;

  background: #F8FAFC;

  border: 1px solid #EAECF0;
  border-radius: 9px;

  transition:
    background .2s ease,
    border-color .2s ease;
}

.cp-faq-nav a:hover {
  background: #EEF4FA;

  border-color: #C7D7E5;
}

.cp-faq-nav span {
  color: #1261A0;

  font-size: 9px;
  font-weight: 700;
}

.cp-faq-nav strong {
  margin-top: 9px;

  color: #102A43;

  font-size: 12px;
}


/* SECTIONS */

.cp-faq-section {
  padding: 52px 0;

  border-top: 1px solid #EAECF0;

  scroll-margin-top: 30px;
}

.cp-faq-section-head {
  margin-bottom: 22px;

  display: flex;
  align-items: center;

  gap: 14px;
}

.cp-faq-section-head > span {
  width: 44px;
  height: 44px;

  flex: 0 0 44px;

  display: flex;

  align-items: center;
  justify-content: center;

  background: #1E3A5F;

  border-radius: 50%;

  color: #fff;

  font-size: 11px;
  font-weight: 700;
}

.cp-faq-section-head p {
  margin: 0 0 2px;

  color: #98A2B3;

  font-size: 9px;
  font-weight: 700;

  letter-spacing: .14em;
}

.cp-faq-section-head h2 {
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;

  color: #102A43 !important;

  font-size: 24px !important;
}


/* FAQ DETAILS */

.cp-faq-list {
  display: grid;

  gap: 8px;
}

.cp-faq-list details {
  overflow: hidden;

  background: #fff;

  border: 1px solid #E4E7EC;
  border-radius: 9px;
}

.cp-faq-list summary {
  position: relative;

  min-height: 64px;

  padding: 16px 54px 16px 18px;

  display: flex;

  align-items: center;

  gap: 13px;

  color: #102A43;

  font-size: 14px;
  font-weight: 600;

  cursor: pointer;

  list-style: none;
}

.cp-faq-list summary::-webkit-details-marker {
  display: none;
}

.cp-faq-list summary > span {
  flex: 0 0 auto;

  color: #1261A0;

  font-size: 15px;
  font-weight: 700;
}

.cp-faq-list summary::after {
  content: "+";

  position: absolute;

  top: 50%;
  right: 20px;

  color: #98A2B3;

  font-size: 23px;
  font-weight: 300;

  transform: translateY(-50%);
}

.cp-faq-list details[open] summary {
  background: #F8FAFC;
}

.cp-faq-list details[open] summary::after {
  content: "−";
}


/* ANSWER */

.cp-faq-answer {
  padding: 20px 22px;

  display: grid;

  grid-template-columns:
    27px minmax(0,1fr);

  gap: 10px;

  border-top: 1px solid #EAECF0;
}

.cp-faq-answer > span {
  color: #98A2B3;

  font-size: 14px;
  font-weight: 700;
}

.cp-faq-answer p {
  margin: 0 0 10px;

  color: #475467;

  font-size: 13px;
  line-height: 1.85;
}

.cp-faq-answer p:last-child {
  margin-bottom: 0;
}

.cp-faq-answer ul {
  margin: 10px 0;
  padding-left: 20px;

  color: #475467;

  font-size: 13px;
  line-height: 1.9;
}

.cp-faq-answer a {
  display: inline-block;

  margin: 5px 0 10px;

  color: #1261A0 !important;

  font-size: 12px;
  font-weight: 700;
}


/* BANK */

.cp-faq-bank {
  margin: 10px 0;
  padding: 14px 16px;

  background: #F8FAFC;

  border-radius: 7px;
}

.cp-faq-bank strong {
  color: #102A43;

  font-size: 13px;
}

.cp-faq-bank p {
  margin: 5px 0 0;

  font-size: 12px;
}


/* SHIPPING FEE */

.cp-faq-shipping-fee {
  margin: 14px 0;

  display: grid;

  grid-template-columns:
    repeat(3, minmax(0,1fr));

  gap: 8px;
}

.cp-faq-shipping-fee > div {
  padding: 13px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  background: #F8FAFC;

  border-radius: 7px;
}

.cp-faq-shipping-fee span {
  color: #667085;

  font-size: 11px;
}

.cp-faq-shipping-fee strong {
  color: #102A43;

  font-size: 14px;
}


/* BOTTOM */

.cp-faq-bottom {
  margin-top: 58px;
  padding: 44px 30px;

  background: #102A43;

  border-radius: 14px;

  text-align: center;
}

.cp-faq-bottom > p {
  margin: 0 0 7px;

  color: rgba(255,255,255,.50);

  font-size: 9px;
  font-weight: 700;

  letter-spacing: .15em;
}

.cp-faq-bottom h2 {
  margin: 0 auto 22px !important;
  padding: 0 !important;

  border: 0 !important;

  color: #fff !important;

  font-size: 22px !important;
}

.cp-faq-bottom > div {
  display: flex;

  justify-content: center;

  gap: 9px;
}

.cp-faq-primary,
.cp-faq-secondary {
  min-height: 47px;

  padding: 0 22px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  border-radius: 8px;

  font-size: 12px;
  font-weight: 700;
}

.cp-faq-primary {
  background: #1261A0;

  color: #fff !important;
}

.cp-faq-secondary {
  background: #fff;

  color: #344054 !important;
}


/* =========================================================
   MOBILE
========================================================= */

@media screen and (max-width: 767px) {

  .cp-faq {
    width: calc(100% - 28px);

    padding-top: 30px;
  }


  .cp-faq-hero {
    padding: 10px 0 32px;
  }

  .cp-faq-hero h1 {
    font-size: 28px !important;
  }

  .cp-faq-lead {
    font-size: 13px;
  }


  .cp-faq-nav {
    margin-bottom: 42px;

    grid-template-columns:
      repeat(2, minmax(0,1fr));

    gap: 7px;
  }

  .cp-faq-nav a {
    min-height: 72px;

    padding: 12px;
  }


  .cp-faq-section {
    padding: 40px 0;
  }

  .cp-faq-section-head {
    gap: 10px;
  }

  .cp-faq-section-head > span {
    width: 39px;
    height: 39px;

    flex-basis: 39px;
  }

  .cp-faq-section-head h2 {
    font-size: 20px !important;
  }


  .cp-faq-list summary {
    min-height: 60px;

    padding:
      14px 45px
      14px 14px;

    gap: 9px;

    font-size: 13px;
    line-height: 1.6;
  }

  .cp-faq-list summary::after {
    right: 15px;
  }


  .cp-faq-answer {
    padding: 17px 15px;

    grid-template-columns:
      22px minmax(0,1fr);

    gap: 7px;
  }

  .cp-faq-answer p,
  .cp-faq-answer ul {
    font-size: 12px;
  }


  .cp-faq-shipping-fee {
    grid-template-columns: 1fr;
  }


  .cp-faq-bottom {
    margin-top: 42px;
    padding: 32px 17px;
  }

  .cp-faq-bottom h2 {
    font-size: 19px !important;
  }

  .cp-faq-bottom > div {
    flex-direction: column;
  }

  .cp-faq-primary,
  .cp-faq-secondary {
    width: 100%;
  }

}

/* =========================================================
   CARPIKAL JAPAN 2026
   TOP HERO
========================================================= */

.cp-top-hero {
  width: calc(100% - 48px);
  max-width: 1200px;
  margin: 42px auto 0;

  font-family:
    "Noto Sans JP",
    "Yu Gothic",
    "游ゴシック体",
    "メイリオ",
    sans-serif;
}

.cp-top-hero *,
.cp-top-hero *::before,
.cp-top-hero *::after {
  box-sizing: border-box;
}

.cp-top-hero a {
  text-decoration: none !important;
}


/* HERO MAIN */

.cp-top-hero-inner {
  min-height: 440px;

  display: grid;
  grid-template-columns:
    minmax(0, 1.08fr)
    minmax(380px, .92fr);

  overflow: hidden;

  background:
    linear-gradient(
      135deg,
      #F7FAFC 0%,
      #EEF4FA 100%
    );

  border: 1px solid #E4EAF0;
  border-radius: 18px;
}


/* COPY */

.cp-top-hero-copy {
  padding: 58px 52px;

  display: flex;
  flex-direction: column;
  justify-content: center;
}

.cp-top-hero-eyebrow {
  margin: 0 0 12px;

  color: #1261A0;

  font-size: 11px;
  font-weight: 700;
  letter-spacing: .15em;
}

.cp-top-hero-copy h1 {
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;
  background: none !important;

  color: #102A43 !important;

  font-size: 40px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  letter-spacing: -.02em;
}

.cp-top-hero-copy h1 span {
  color: #1261A0;
}

.cp-top-hero-lead {
  max-width: 590px;

  margin: 22px 0 0;

  color: #5F6C7B;

  font-size: 14px;
  line-height: 1.9;
}

.cp-top-hero-actions {
  margin-top: 28px;

  display: flex;
  gap: 10px;
}

.cp-top-button {
  min-height: 50px;

  padding: 0 24px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border-radius: 8px;

  font-size: 13px;
  font-weight: 700;
}

.cp-top-button--primary {
  background: #1261A0;

  color: #fff !important;
}

.cp-top-button--primary:hover {
  background: #0E548C;
}

.cp-top-button--secondary {
  background: #fff;

  border: 1px solid #CBD5E1;

  color: #344054 !important;
}


/* FINDER */

.cp-top-hero-finder {
  margin: 24px;
  padding: 32px;

  align-self: stretch;

  background: #fff;

  border: 1px solid #DFE7EF;
  border-radius: 13px;

  box-shadow:
    0 12px 30px rgba(16,42,67,.06);

  display: flex;
  flex-direction: column;
  justify-content: center;
}

.cp-top-hero-finder-label {
  margin: 0 0 6px;

  color: #98A2B3;

  font-size: 9px;
  font-weight: 700;
  letter-spacing: .15em;
}

.cp-top-hero-finder h2 {
  margin: 0 0 20px !important;
  padding: 0 !important;

  border: 0 !important;
  background: none !important;

  color: #102A43 !important;

  font-size: 21px !important;
}

.cp-top-hero-finder-grid {
  display: grid;

  grid-template-columns:
    repeat(2, minmax(0,1fr));

  gap: 9px;
}

.cp-top-hero-finder-grid a {
  min-height: 85px;

  padding: 15px;

  display: flex;
  flex-direction: column;
  justify-content: center;

  background: #F8FAFC;

  border: 1px solid #EAECF0;
  border-radius: 8px;

  transition:
    background .2s ease,
    border-color .2s ease,
    transform .2s ease;
}

.cp-top-hero-finder-grid a:hover {
  background: #EEF4FA;

  border-color: #C7D7E5;

  transform: translateY(-2px);
}

.cp-top-hero-finder-grid strong {
  color: #102A43;

  font-size: 13px;
}

.cp-top-hero-finder-grid span {
  margin-top: 4px;

  color: #98A2B3;

  font-size: 10px;
}

.cp-top-hero-finder-more {
  margin-top: 14px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  color: #1261A0 !important;

  font-size: 12px;
  font-weight: 700;
}


/* TRUST */

.cp-top-trust {
  margin-top: 12px;

  display: grid;

  grid-template-columns:
    repeat(3, minmax(0,1fr));

  background: #102A43;

  border-radius: 10px;

  overflow: hidden;
}

.cp-top-trust > div {
  min-height: 76px;

  padding: 16px 22px;

  display: flex;
  flex-direction: column;
  justify-content: center;

  border-right:
    1px solid rgba(255,255,255,.12);
}

.cp-top-trust > div:last-child {
  border-right: 0;
}

.cp-top-trust strong {
  color: #fff;

  font-size: 14px;
}

.cp-top-trust span {
  margin-top: 4px;

  color: rgba(255,255,255,.62);

  font-size: 10px;
}


/* =========================================================
   MOBILE
========================================================= */

@media screen and (max-width: 767px) {

  .cp-top-hero {
    width: calc(100% - 28px);

    margin-top: 22px;
  }

  .cp-top-hero-inner {
    min-height: 0;

    grid-template-columns: 1fr;

    border-radius: 13px;
  }

  .cp-top-hero-copy {
    padding: 30px 20px 24px;
  }

  .cp-top-hero-copy h1 {
    font-size: 28px !important;
  }

  .cp-top-hero-lead {
    margin-top: 16px;

    font-size: 12px;
  }

  .cp-top-hero-actions {
    flex-direction: column;

    margin-top: 22px;
  }

  .cp-top-button {
    width: 100%;
  }


  .cp-top-hero-finder {
    margin: 0 14px 14px;
    padding: 20px 16px;

    box-shadow: none;
  }

  .cp-top-hero-finder h2 {
    font-size: 18px !important;
  }

  .cp-top-hero-finder-grid {
    gap: 7px;
  }

  .cp-top-hero-finder-grid a {
    min-height: 75px;

    padding: 12px;
  }


  .cp-top-trust {
    grid-template-columns: 1fr;
  }

  .cp-top-trust > div {
    min-height: 60px;

    padding: 13px 17px;

    border-right: 0;
    border-bottom:
      1px solid rgba(255,255,255,.10);
  }

  .cp-top-trust > div:last-child {
    border-bottom: 0;
  }

}
/* =========================================================
   TOP2026 BEST SELLERS
========================================================= */

@media screen and (min-width: 960px) {

  #cptop2026BESTSELLERS,
  .cptop2026BESTSELLERS {
    width: calc(100% - 48px) !important;
    max-width: 1200px !important;
    margin: 64px auto 0 !important;
  }

  #cptop2026BESTSELLERS img,
  .cptop2026BESTSELLERS img {
    max-width: 100% !important;
    height: auto !important;
  }

}

/* =========================================================
   TOP2026 RECENTLY VIEWED ITEMS
   最近チェックしたアイテム
========================================================= */

@media screen and (min-width: 960px) {

  #topRVI,
  .topRVI {
    width: calc(100% - 48px) !important;
    max-width: 1200px !important;

    margin: 64px auto 0 !important;
  }

  #topRVI img,
  .topRVI img {
    max-width: 100% !important;
    height: auto !important;
  }

}

/* =========================================================
   TOP2026 PRODUCT BLOCKS
   PC中央揃え
========================================================= */

#cptop2026BESTSELLERS,
.cptop2026BESTSELLERS,
#topRVI,
.topRVI {
  display: block !important;

  width: calc(100% - 48px) !important;
  max-width: 1200px !important;

  margin-left: auto !important;
  margin-right: auto !important;

  float: none !important;
  clear: both !important;

  position: relative !important;
  left: auto !important;
  right: auto !important;
}

/* BEST SELLERS */
#cptop2026BESTSELLERS,
.cptop2026BESTSELLERS {
  margin-top: 72px !important;
}

/* 最近チェック */
#topRVI,
.topRVI {
  margin-top: 72px !important;
}


/* MOBILE */
@media screen and (max-width: 767px) {

  #cptop2026BESTSELLERS,
  .cptop2026BESTSELLERS,
  #topRVI,
  .topRVI {
    width: calc(100% - 28px) !important;

    margin-left: auto !important;
    margin-right: auto !important;

    float: none !important;
  }

}
@media screen and (max-width:480px){
.logo img {
  width: 400px;
}

.logo_all {
  display: flex;
}

header .headerTop .basket {
  position: absolute;
  top: 0;
  right: 0;
}

header .headerTop {
  height: 50px;
  background: #fff;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

header .headerTop .menuBtn .inner .funcIcon {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 24px;
  height: 2px;
  margin: -1px 0 0 -12px;
  background: #333;
  -moz-transition: 0.2s;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}

header .headerTop .identityLogo a .logo {
  display: block;
  padding-top: 2px;
  width: 147px;
  height: 21px;
  background: url(/resource/common/sp/images/header/logo_id_01.png) no-repeat 0 2px;
  -moz-background-size: 147px 21px;
  -webkit-background-size: 147px 21px;
  background-size: 147px 21px;
  text-indent: -9999px;
}

.flexbox {
  display: flex;
  justify-content: space-between;
}

.splogo {
  margin: auto;
  text-align: center;
}

.item_list_box .item_list_accshow {
  width: 100%;
  height: auto;
  padding: 0;
  overflow: hidden;
  opacity: 0;
  transition: 0.8s;
  position: absolute;
  z-index: 10000;
  display: none;
}

.item_list_box label {
  display: block;
  margin: 1.5px 0;
  padding: 11px 12px;
  color: #2f8fcf;
  font-weight: bold;
  background: #a4cbf3;
  cursor: pointer;
  transition: all 0.5s;
}

.item_list_flexwrap li {
  width: 150px;
  margin: 10px;
  height: auto;
  display: flex;
}

.item_list_flexwrap {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

.sp_hidden_box {
  margin: 2em 0;
  padding: 0;
}

.sp_hidden_box .sp_hidden_show {
  height: 0;
  padding: 0;
  overflow: hidden;
  opacity: 0;
  transition: 0.8s;
}

.sp_hidden_box input: checked~.sp_hidden_show {
  padding: 10px 0;
  height: auto;
  opacity: 1;
}

.gridnavisphead nav ul sysText.li {
  display: block;
  width: 100%;
  background-color: #eee;
  color: #fff;
  padding: 12px;
  width: 100%;
  margin: 0;
  cursor: pointer;
}

.item_parts_navi, .item_parts_navi2 {
  flex-wrap: wrap;
  "}
 .item_parts_navi li, .item_parts_navi2 li {
    width: 25%;
    height: : auto;
  }
  .category_infomation div {
    width: 49%;
  }
  .item_recomend ul li {
    width: 49%;
    padding: 1%;
  }

  .sysItemName h1 {
    font-size: 1.45rem;
    line-height: 1.9rem;
  }
  .gridsp2 ul {
    width: 100%;
  }
  .gridsp2 ul li img {
    width: 80%;
  }
  .minicart {
    background: url(https: //carpikal-japan.com/img/cart_nakami.png) 0 center no-repeat;
  }
  .minicart .aiContent {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
  }
  #cart_fixd {
    display: block;
    width: 15%;
    position: fixed;
    right: 0;
    z-index: 9999;
    bottom: 0px;
    text-align: center;
    padding: 0 auto;
  }
  .sabcategory-list-design li {
    background-color: #23466e;
    width: 100%;
    padding: 15px;
    margin: 5px;
  }
  .sysCallPrintReceipt form button {
    background-color: #23466e;
    color: #fff;
    padding: 2px;
  }
  .sysItemName h1 span {
    font-size: 2rem;
  }

.sysCart#sysRegi #sysMain input[type='submit'].sysLoginButton, .sysCart#sysRegi #sysMain input[type='submit'].sysNextSubmit {
  position: static;
  width: 100%;
  margin: 15px auto 0;
  font-size: 1.5rem;
  border-radius: 5px;
  font-weight: bold;
  background: #A61C2A !important;
  padding: 12px 5px !important;
  color: #fff;
  height: auto;
}
}
@media screen and (min-width:481px) and (max-width:960px){
.item_parts_navi li,.item_parts_navi2 li {
    width: 150px;
    higth: auto;
}
.category_infomation div {
    width: 28%;
}
.item_recomend ul li {
    width: 30%;
    padding: 1%;
}
.minicart {
    text-align: center;
    width: 100%;
    background-color: #efefef;
    padding: 10px 0;
    font-size: 13px;
    margin-bottom: 0 !important;
}
.minicart .sysContent,.minicart .aiContent {
    max-width: 800px;
    margin: 0 auto !important;
    display: flex;
    text-align: center;
}
.minicart dd span {
    color: #ff5080;
    font-weight: bolder;
}
.minicart .sysContent,.minicart .aiContent {
    max-width: auto;
    padding-left: 0 !important;
    text-align: center;
    background: none;
}
.minicart .sysCartInfoItemCount {
    padding-left: 30px;
    background: url(https: //carpikal-japan.com/img/top/ico_cart.png) 0 center no-repeat;
    background-size: 18px;
    margin-right: 20px;
}
.minicart .sysCartInfoTotalPrice,minicart .sysCartInfoRemainFreeShipping {
    margin-right: 40px;
}
.minicart dd, .minicart dl, .minicart dt {
    display: inline-block;
}
.sabcategory-list-design li {
    background-color: #23466e;
    width: 250px;
    padding: 15px;
    margin: 5px;
}

.sysCart#sysRegi #sysMain input[type='submit'].sysLoginButton, .sysCart#sysRegi #sysMain input[type='submit'].sysNextSubmit {
  position: static;
  width: 100%;
  margin: 15px auto 0;
  font-size: 1.5rem;
  border-radius: 5px;
  font-weight: bold;
  background: #A61C2A !important;
  padding: 12px 5px !important;
  color: #fff;
  height: auto;
}
}
@media screen and (min-width:961px){
#sp-logo,.sp_login,.sp_cart {
    display: none;
}
/* PC */
@media screen and (min-width:960px){

.item_recomend ul{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
}

.item_recomend ul li{
    width:48%;
    padding:0;
    margin-bottom:15px;
}

.item_recomend ul li img{
    width:100%;
    display:block;
}

}

.item_list_flexwrap {
    flex-wrap: wrap;
}
.item_list {
    width: 1140px;
    margin: auto;
}
.item_list_accshow {
    width: 650px;
    height: auto;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
    position: absolute;
    z-index: 10000;
    display: none;
}
.item_list ul {
    display: flex;
    text-align: center;
    margin: 0 auto;
}
.item_list ul li {
    margin-left: 20px;
    padding: 20px;
}
header ul .item_list_box label:hover {
    background: linear-gradient(transparent 80%, #a8eaff 50%);
    　cursor: pointer;
}
.item_list_wrap ul li label {
    text-decoration: none;
    font-size: 18px;
}
.item_list_flexwrap li {
    width: 130px;
    height: 130px;
}
.item_parts_navi li {
    width:150px;
    higth: auto;
}
.item_parts_navi2 li {
    width: 100px;
    higth: auto;
}
.category_infomation div {
    width: 29%;
}
.item_recomend ul li {
    width: 33%;
    padding: 1%;
}
.gridsp2 {
    width: 500px;
}
.sysItemName h1 {
    font-size: 2rem;
    line-height: 2.3rem;
}

#cart_fixd {
    display: block;
    position: fixed;
    right: 0;
    z-index: 9999;
    bottom: 100px;
    text-align: center;
    padding: 0 auto;
}
.sabcategory-list-design li {
    background-color: #23466e;
    width: 250px;
    padding: 15px;
    margin: 5px;
}
.sysCallPrintReceipt form button {
    background-color: #23466e;
    color: #fff;
    padding: 2px;
}
.opcCommonEditModeBlock {
    width: 750px;
    margin: 0 auto;
}
.sysNextSubmitAreaForUseAmazon {
    margin-top: 30px;
}
#sysBasket #sysMain .sysTotal .sysTotalTxt {
    border: 3px solid #ff0000;
    padding: 20px 0px 20px 0px;
    text-align: center;
}


.opcOrderSummary_normalTotalPrice{
width:75%;
}

.opcDeliveryMethod_backButton_edit{
width:70px;

}

.opcDeliveryMethod_completeButton_edit{

width:500px !important;
background: ##ff8400;!important;
}

.sysCart#sysRegi #sysMain input[type='submit'].sysLoginButton, .sysCart#sysRegi #sysMain input[type='submit'].sysNextSubmit {
  position: static;
  width:300px;
  margin: 15px auto 0;
  font-size: 1.5rem;
  border-radius: 5px;
  font-weight: bold;
  background: #A61C2A !important;
  padding: 12px 5px !important;
  color: #fff;
  height: auto;
}
}
/* #END_OF_RESOURCE_FILE */
