@charset "utf-8";
/******
		contents
					******/

.main-inner {
  display: flex;
  flex-wrap: nowrap;
  padding: 32px 0;
}

.side {
  flex: 1;
  max-width: 200px;
}

.side-box {
  text-align: left;
  margin-bottom:24px;
}

.side-box-title {
  border-top: 3px solid #3498CB;
  border-left: 1px solid #B2B2B2;
  border-right: 1px solid #B2B2B2;
  text-align: center;
  font-weight: 900;
  color: #3498CB;
  font-size: 18px;
  padding: 12px 4px;
}

.right-side-title {
  background: #F6853B;
  color: #fff;
  border-top: 1px solid #B2B2B2;
  padding: 12px 4px 6px 4px;
}

.right-side-title img {
  width: 90%;
}

.side-box-inner {
  border: 1px solid #B2B2B2;
  padding: 4px 4px;
  background: #fff;
}

.side-box-inner iframe {
  overflow: hidden;
  max-width: 100%;
  max-height: 64px;
  overflow: initial;
}

.side-box-form {
  margin: 8px 0;
}

.side-box-form label {
  font-size: 12px;
  color: #3498CB;
  font-weight: bold;
}

.side-box-form input,.side-box-form select {
  width: 100%;
  height: 37px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #B2B2B2;
  border-radius: 4px;
  padding: 2px 4px 0 4px;
}

.options-select {
  color: gray;
}

.side-form-btn input {
  width: 100%;
  height: 37px;
  font-size: 14px;
  font-weight: bold;
  border: none;
  border-radius: 4px;
  padding: 0 4px;
  background: #3498CB;
  color: #fff;
  margin-top: 8px;
}

.cart-info-list {
  font-size: 14px;
  color: #B2B2B2;
}

.cart-info-list span {
  font-size: 16px;
  color: #FE0005;
}

.side-cart-btn a {
  background: #F6853B;
  color: #fff;
  width: 100%;
  display: block;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  margin-top: 8px;
}

.center-contents {
  flex: 4;
}

.center-contents {
  margin: 0 16px;
}

.key-box img {
  width: 100%;
}

.key-bottom {
  display: flex;
}

.key-bottom-point {
  border: 2px solid #3498CB;
  background: #fff;
  padding: 16px;
  font-size: 14px;
  line-height: 150%;
  margin-top: 16px;
}

.point-text {
  margin-top: 16px;
  text-align: justify;
}

.top-news-box {
  border: 2px solid #22B573;
  margin-top: 16px;
  padding: 16px;
}

.top-news-box ul {
  border-top: 1px solid #22B573;
  margin-top: 16px;
}

.top-news-box ul li {
  text-align: left;
  padding: 2px 0;
  font-size: 16px;
}

.top-news-box ul li a {
  color: #000;
}

.top-news-box li span {
  font-size: 12px;
  color: gray;
}

.contents-box {
  margin-top: 24px;
}

.contents-title {
  background: #3498CB;
  border-top: 2px solid #0072C1;
  padding: 16px;
  text-align: left;
  color: #fff;
  font-weight: bold;
}

.contents-box-inner {
  display: flex;
  flex-wrap: wrap;
}

.contents-list-error {
  margin-top: 32px;
}

.contents-list {
  width: 20%;
  padding: 12px;
  margin: 0 -1px -1px 0;
  border: 1px #ccc solid;
}

.contents-text {
  font-size: 14px;
  margin: 8px 0;
  line-height: 140%;
  text-align: left;
  max-height: 21px;
  overflow: hidden;
}

.contents-car-btn a {
  background: #F6853B;
  color: #fff;
  width: 100%;
  display: block;
  font-size: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
}

.contents-car-btn button {
  background: #F6853B;
  color: #fff;
  width: 100%;
  display: block;
  font-size: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
}

.contents-car-btn ion-icon {
  margin-right: 2px;
}

.page-nation ul {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 32px;
}

.page-nation ul li {
  font-size: 20px;
  margin: 0 8px;
  background: #ccc;
  width: 24px;
}

.tab-group{
  display: flex;
  justify-content: center;
}

.tab{
  flex-grow: 1;
  padding:5px;
  list-style:none;
  border:solid 1px #CCC;
  text-align:center;
  cursor:pointer;
  font-size: 14px;
  font-weight: bold;
}

.panel-group{
  border-top:none;
}

.panel{
  display:none;
}

.tab.is-active{
  background:#3498CB;
  color:#FFF;
  transition: all 0.2s ease-out;
}

.panel.is-show{
  display:block;
}

.ranking-list {
  margin: 8px 0;
  padding: 8px 0;
  border-bottom: 1px solid #ccc;
}

.ranking-img img {
  width: 100%;
}

.ranking-text {
  font-size: 14px;
  line-height: 130%;
  margin-top: 12px;
}

.ranking-more a {
  width: 100%;
  font-size: 14px;
  font-weight: bold;
  border: none;
  border-radius: 4px;
  padding: 0 4px;
  background: #3498CB;
  color: #fff;
  margin-top: 8px;
  display: inline-block;
  text-align: center;
  line-height: 32px;
}

.grange-bg {
  background-image: linear-gradient(0deg, #f6d365 0%, #FF8C00 100%);
  border-top: 4px solid #FF4B00;
}

.single-main {
  padding: 16px 0;
}

.single-image img {
  width: 100%;
}

.single-data table {
  text-align: left;
  margin-top: 24px;
  width: 100%;
}

.single-data table tr {
  border-bottom: 1px solid gray;
}

.single-data table td {
  padding: 12px 10px;
  border-top: 1px solid gray;
  font-size: 14px;
}

.single-data table .nw {
  width: 22%;
  font-weight: bold;
  font-size: 14px;
  color: #FF4B00;
}

.single-digest {
  margin-top: 32px;
}

.single-digest img {
  width: 100%;
}

.single-cart .cart-in {
  margin-top: 32px;
  height: 50px;
  font-size: 18px;
  font-weight: bold;
  border-radius: 5px;
}

.single-cart a {
  margin-top: 32px;
  height: 50px;
  font-size: 18px;
  font-weight: bold;
  border-radius: 5px;
}


.cart-main ul li {
  display: flex;
  padding: 16px 0;
  border-bottom: 1px solid #CFC8C8;
}

.cart-img {
  flex: 1;
}

.cart-desc {
  flex:2;
  text-align: left;
  padding-left: 30px;
}

.cart-code {
  font-size: 14px;
  color: #333;
}

.cart-title {
  font-size: 18px;
  font-weight: bold;
  margin: 8px 0;
}

.cart-price {
  font-weight: bold;
}

.cart-bottom {
  display: flex;
  align-items: center;
  margin-top: 16px;
}

.cart-delete {
  border-left: 1px solid #CFC8C8;
  margin-left: 12px;
  padding-left: 12px;
}

.cart-delete button {
  font-size: 14px;
  border: none;
  color: #436195;
  background: none;
}

.cart-total table {
  margin-right: 0;
  margin-left: auto;
}

.cart-total .total-label {
  font-size: 12px;
  color: #333;
}

.cart-total td {
  padding: 6px 12px;
  border-bottom: 1px solid #CFC8C8;
  font-weight: bold;
  font-size: 18px;
  text-align: right;
}

.cart-total .total-last,.cart-total .total-last .total-label {
  background: #3498CB;
  color: #fff;
}

.cart-btn a {
  margin-top: 32px;
  background: #FFD814;
  color: #000;
  font-weight: normal;
  font-size: 16px;
}

.step-box {
  margin-bottom: 32px;
}

.form-box {
  text-align: left;
  border: 1px solid #B2B2B2;
  padding: 24px;
  border-radius: 6px;
  margin-top: 16px;
  font-family: '游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic;
}

.form-list {
  margin-bottom: 16px;
  border-bottom: 1px solid #CFC8C8;
  padding-bottom: 24px;
}

.form-list label {
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 4px;
}

.form-list input , .form-list select {
  padding: 4px;
  height: 40px;
  font-size: 16px;
  background: #F4F5F9;
  border: 2px solid #E4E4E6;
  border-radius: 3px;
}

.form-list input:focus , .form-list:focus {
  border: 2px solid #ff9900;
  outline: 0;
}

.form-list .form-split {
  align-items: center;
}

.form-list .form-split input {
  flex:1;
  margin-right: 10px;
}

.form-note {
  font-size: 14px;
  margin-top: 8px;
  line-height: 150%;
}

.form-select-box {
  display: flex;
}

.form-list-inner {
  display: inline-block;
  padding-left: 32px;
}

.form-list-inner:first-child {
  padding-left: 0px;
}

.form-single {
  margin-bottom: 16px;
}

.form-address-box {
  margin-top: 8px;
}

.cart-btn button {
  color: #fff;
  width: 100%;
  display: block;
  text-align: center;
  font-size: 16px;
  margin-top: 32px;
  background: #FFD814;
  color: #000;
  height: 50px;
  border: none;
}

.conf-btn button {
  color: #fff;
  width: 100%;
  display: block;
  text-align: center;
  font-size: 16px;
  margin-top: 12px;
  background: gray;
  color: #fff;
  height: 50px;
  border: none;
}

.conf-box {
  margin-bottom: 32px;
}

.conf-tilte h2 {
  text-align: left;
  font-size: 16px;
  margin-top: 24px;
  border-bottom: 2px solid #5498C7;
  color: #5498C7;
  padding-left: 16px;
}

.conf-data table {
  width: 100%;
  text-align: left;
  margin: 12px 0 0px 0;
}

.conf-data table tr td {
  padding: 12px 12px;
  border: 1px solid #CFC8C8;
  font-size: 14px;
}

.conf-table-label {
  background: #E6E6E6;
}

.cart-scroll {
  height: 500px;
  overflow: scroll;
  border: 2px solid #CFC8C8;
  padding: 12px 24px;
  background: #f7f7f7;
}

.conf-total {
  background: #F4F5F9;
}

.thx-message {
  margin-top: 24px;
}

.thx-back-btn a {
  background: #999999;
  color: #fff;
  font-weight: bold;
  width: 300px;
  max-width: 100%;
  display: block;
  margin: auto;
  border-radius: 4px;
  margin-top: 32px;
  line-height: 40px;
}

.item_form > input {
  width: 100%;
  height: 28px;
}

.actor_form > input, .keyword_form > input {
  height: 28px;
  width: 90%;
}

.actor, .keyword {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.actor_form, .keyword_form {
  width: 20%;
  margin-bottom: 16px;
}

.form-line {
  padding-top: 12px;
  padding-bottom: 12px;
}

.form-line > p, .actor_form > p, .keyword_form > p {
  font-size: 20px;
}

.point_form > textarea, .news-input > textarea {
  width: 100%;
  height: 52px;
}

.admin_list_table {
  width: 100%;
  table-layout: fixed;
}

.admin_list_table tr {
  width: 100%;
}

.admin_list_table tr td {
  border-bottom: 1px solid gray;
  margin: 0;
  padding: 16px 6px;
  word-wrap: break-word;
}

.user-id {
  width: 8%;
}

.user-name {
  width: 10%;
}

.user-name-kana{
  width: 10%;
}

.user-mailadress {
  width: 10%;
}

.user-phone-number {
  width: 10%;
}

.user-table-btn {
  width: 6%;
}

.admin_list_table button {
  background-color: #00b4d4;
  border: none;
  color: #fff;
  font-size: 14px;
  width: 100%;
  border-radius: 4px;
  line-height: 28px;
}

.form-line > .form-exception {
  font-size: 12px;
}

.form-list .input-error {
  border-color: red;
}

/* モーダル コンテンツエリア */
#modal-main {
   display: none;
   width: 400px;
   height: 250px;
   margin: 0;
   padding: 0;
   background-color: #ffffff;
   color: #666666;
   position:fixed;
   z-index: 999;
   border-radius: 10px;
   align-items: center;
   justify-content: center;
  }

  /* モーダル 背景エリア */
  #modal-bg{
   display:none;
   width:100%;
   height:100%;
   background-color: rgba(0,0,0,0.5);
   position:fixed;
   top:0;
   left:0;
   z-index: 1;
  }

  .module-comment {
    padding-top: 100px;
  }

  #modal-close {
    margin-top: 20px;
    display: block;
  }

  .user_list_button {
    border: none;
    background-color: #eee;
  }

  .admin_user_item {
    list-style: none;
  }


/* 管理画面スタイル */
  .admin-inner {
    display: flex;
    background-color: #eee;
    min-height: 100vh;
  }

  .admin-nav-title {
    padding: 64px 0 32px 0;
    font-size: 16px;
    font-weight: bold;
  }

  .admin-nav{
    flex: 1;
    background:#001b1f;
    color: white;
    padding: 32px;
    text-align: left;
  }

  .admin-page-label {
    font-size: 22px;
    color: #000;
    border-left: 2px solid #000;
    padding-left: 16px;
    margin-bottom: 16px;
  }

  .admin-page-label a {
    font-size: 14px;
    margin-top: 10px;
    color: #00b4d4;
    text-decoration: underline;
  }

  .admin-nav a{
    color: white;
    font-size: 18px;
    text-decoration: none;
    border-bottom: 1px solid #f7f7f7;
    display: block;
    padding: 16px 0;;
  }

  .admin-right-box {
    flex: 7;
    text-align: left;
    padding: 32px 64px;
  }

  .admin-right-inner {
    padding: 24px 24px;
    background-color: #fff;
    border-radius: 10px;
  }

  .item-style p {
    font-size: 16px;
    margin-bottom: 8px;
    border-left: 2px solid #A4CAF5;
    padding-left: 12px;
  }

  .item-style input {
    border: 1px solid #A4CAF5;
    background-color:#E8F7FF;
    border-radius: 3px;
    height: 40px;
  }

  .category_form label {
    margin-right: 16px;
  }

  .required {
    font-size: 12px;
    color: #fff;
    margin-left: 4px;
    background-color: red;
    padding: 2px 2px 2px 2px;
    border-radius: 4px;
  }

  .form-line button {
    background-color: #00b4d4;
    border: none;
    color: #fff;
    font-size: 16px;
    width: 300px;
    border-radius: 4px;
    line-height: 46px;
    padding-top: 2px;
    margin: auto;
    display: block;
    box-shadow: #f7f7f7 0 0 3px;
  }

  .user-detail-wrap {
    text-align: left;
  }

  .user-detail-wrap table {
    width: 100%;
  }

  .user-detail-wrap table td {
    padding: 16px 16px;
    border-bottom:1px solid #eee ;
  }

  .user-detail-wrap tr td:first-child {
    color: gray;
  }

  .user-memo-label {
    text-align: left;
    margin-top: 32px;
    margin-bottom: 16px;
    border-left: 2px solid #A4CAF5;
    padding-left: 12px;
  }

  .user-memo-form {
  }

  .user-memo-form textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #A4CAF5;
    background-color:#E8F7FF;
    border-radius: 4px;
    height: 160px;
    font-size: 14px;
  }

  .user-memo-btn button {
    background-color: #00b4d4;
    border: none;
    color: #fff;
    font-size: 16px;
    width: 300px;
    border-radius: 4px;
    line-height: 46px;
    padding-top: 2px;
    margin: auto;
    display: block;
    box-shadow: #f7f7f7 0 0 3px;
    margin-top: 16px;
  }

  .user-detail-list {
    margin: 64px 0;
  }

  .user-detail-print button {
    display: block;
    margin: auto;
    margin-top: 32px;
    background-color: gray;
    border: none;
    color: #fff;
    font-size: 16px;
    width: 300px;
    border-radius: 4px;
    line-height: 46px;
    padding-top: 2px;
    box-shadow: #f7f7f7 0 0 3px;
  }

  .user-detail-list tr th {
    padding: 16px 16px;
    border-bottom: 1px solid #eee;
  }

  .user-detail-list tr td:first-child {
    color: #000;
  }

  #user-print {
    max-width: 1240px;
    padding: 64px 32px;
    margin: auto;
  }

.print-label {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 8px;
}

#user-print .user-detail-wrap table td {
  padding: 10px 0;
  font-size: 14px;
}

#user-print .user-detail-list{
  margin: 32px 0 0 0;
}

#user-print .user-detail-list tr th {
  padding: 10px 0;
  font-size: 14px;
}

#news-body {
  min-height: 100vh;
}

.admin_news_table {
  width: 100%;
}

.admin_news_table td {
  padding: 16px 16px;
  border-bottom:1px solid #eee;
}

.news_list_news p {
  height: 46px;
  overflow: hidden;
}

.admin_news_table button {
  background-color: #00b4d4;
  border: none;
  color: #fff;
  font-size: 14px;
  width: 60px;
  border-radius: 4px;
  line-height: 28px;
}

.news-input textarea {
  min-height: 500px;
  padding: 16px;
  margin-top: 16px;
}

.sarch-box {
  margin-bottom: 32px;
}

.sarch-btn button {
  display: block;
  margin: auto;
  margin-top: 16px;
  background-color: gray;
  border: none;
  color: #fff;
  font-size: 16px;
  width: 300px;
  border-radius: 4px;
  line-height: 46px;
  padding-top: 2px;
}

.pagenation-div {
  display: flex;
}

.pagenation-div > ul {
  display: flex;
}

.pagenation-div {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 30px;
}

.pagenation-div p button {
  margin: 0 8px;
  background: #F6853B;
  border: none;
  color: #fff;
  border-radius: 2px;
}

.pagenation-div ul li a {
  color: #fff;
  background-color: #F6853B;
  border-radius: 50px;
  height: 30px;
  width: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 8px;
  font-size: 16px;
}

[aria-selected="true"] > a {
  color: #F6853B !important;
  background-color: white !important;
  border: solid #F6853B 1px;
}
.pager-inner > li {
  display: none;
}
/* .pager-inner > li:first-child {
  display: block !important;
}

.pager-inner > li:last-child {
  display: block !important;
} */
.current-before {
  display: block !important;
}
.current + li {
  display: block !important;
}
.current + li + li {
  display: block !important;
}
.current {
  display: block !important;
}
.form-wrapper {
  background: #fafafa;
  margin: 3em auto;
  padding: 0 1em;
  max-width: 370px;
}
.h1_login {
  text-align: center;
  padding: 1em 0;
}
.login-form {
  padding: 0 1.5em;
}
.login-form-item {
  margin-bottom: 0.75em;
  width: 100%;
}
.login-form-item > input {
  background: #fafafa;
  border: none;
  border-bottom: 2px solid #e9e9e9;
  color: #666;
  font-family: 'Open Sans', sans-serif;
  font-size: 1em;
  height: 50px;
  transition: border-color 0.3s;
  width: 100%;
}
.login-form-item > input:focus {
  width: 100%;
}
.button-panel .button {
  background: #f16272;
  border: none;
  color: #fff;
  cursor: pointer;
  height: 50px;
  font-family: 'Open Sans', sans-serif;
  font-size: 1.2em;
  letter-spacing: 0.05em;
  text-align: center;
  text-transform: uppercase;
  transition: background 0.3s ease-in-out;
  width: 100%;
}
.button:hover {
  background: #ee3e52;
}
.button-panel {
  padding-bottom: 24px;
}
.list-image-select {
  padding: 12px 0;
}
.selected-image {
  padding: 12px 0;
}
.admin_list_img {
  width: 10%;
  table-layout: fixed
}
.admin_list_img a {
  display: block;
}
.admin_list_id {
  width: 8%;
  table-layout: fixed
}
.admin_list_title {
  width: 30%;
  /* overflow: scroll; */
  white-space: normal;
}
.admin_list_actress {
  width: 14%;

}
.admin_list_manufacturer {
  width: 14%;
  table-layout: fixed
}
.admin_list_arrival_day {
  width: 8%;
  font-size: 14px;
  line-height: 150%;
}
.admin-item-list-button {
  width: 8%;
}
.admin-item-list-button button {
  font-size: 12px;
}
.item-list-tr {
  width: 100%;
}
.item-list-tr td {
  word-wrap: break-word;
}
.admin_list_img img {
  width: 100%;
}
.category_list_news > p {
  overflow: hidden;
}
.category_input_form {
  margin-top: 12px;
  width: 240px;
}
.age_confirm_title {
  margin:56px 0;
  font-size: 26px;
  font-weight: normal;
  color: #1F2D3D;
}
.age_question {
  margin-bottom: 16px;
  font-size: 18px;
  font-weight:bold;
}
.age_explanation {
  margin-bottom: 40px;
  font-size: 14px;
  line-height: 2;
  color: #8f8f8f;
}
.age_button {
  display: flex;
  justify-content: space-around;
  max-width: 760px;
  margin: auto;
}
.age_no_button {
  
}
.age_no_button > a {
  display: block;
  color: #001b1f;
  width: 300px;
  max-width: 100%;
  padding: 10px 0;
  margin: auto;
  border: solid black 1px;
  border-radius: 30px;
}
.age_yes_button {
  
}
.age_yes_button > a {
  display: block;
  color: white;
  width: 300px;
  max-width: 100%;
  padding: 10px 0;
  margin: auto;
  border: solid #ee2737 1px;
  background-color: #ee2737;
  border-radius: 30px;
}
.admin-item-list-button > .not-show {
  background-color: green;
}