@charset "shift_jis";
/* CSS Document */
.movie-space {
  margin: 3em auto;
  width: calc(80%);
}
.link_bn {
  width: 80%;
  margin: 0 auto;
}
/*--------------------------------------------------------------------------------バナー用 */
.fr_02 {
  padding: 2em 0 1em;
}
.fr_02 .banner {
  text-align: center;
}
.fr_02 .banner img {
  width: 80%;
}
/*--------------------------------------------------------------------------------寄*/
.p_n {
  width: 100%;
  padding: 0 2em;
  margin: 2em auto;
}
.p_n p {
  margin: 0;
  width: 100%;
}
.p_r {
  width: 100%;
  padding: 0 2em;
  margin: 2em auto;
}
.p_r p {
  width: 100%;
  margin: 0;
}
.p_r img {
  float: right;
  max-width: 43%;
  margin: 0 0 2em 2em;
}
.p_l {
  width: 100%;
  padding: 0 2em;
  margin: 2em auto;
}
.p_l p {
  width: 100%;
  margin: 0;
}
.p_l img {
  float: left;
  max-width: 43%;
  margin: 0 2em 2em 0;
}
/*--------------------------------------------------------------------------------寄*/
.aa01 {
  margin: 0 2em 2em;
}
.aa01 h2 {
  position: relative;
  font-size: 1.6em;
  width: 100%;
  color: #ffffff;
  border-radius: 25px;
  background: rgba(0, 131, 171, 1.00);
  padding: 0.8em 0.8em 0.8em 1em;
  margin: 2em auto;
}
.aa01 h2:before {
  position: absolute;
  bottom: -19px;
  left: 30px;
  content: '';
  border-width: 20px 10px 0 10px;
  border-style: solid;
  border-color: rgba(0, 131, 171, 1.00) transparent transparent transparent;
}
.aa01 div.p_r {
  width: 100%;
  padding: 0 2em;
  margin: 2em auto;
}
.aa01 div.p_r p {
  width: 100%;
  margin: 0;
}
.aa01 div.p_r img {
  float: right;
  max-width: 43%;
  margin: 0 0 2em 2em;
}
.rounded {
  background: #FFFDD1;
  border-radius: 20px;
  padding: 1em 1.3em;
  margin: 1em;
}
.rounded h3.i_title {
  background: #535353;
  color: #FFFFFF;
  font-size: 1.6em;
  padding: 0.5em 1em;
  margin-bottom: 0.5em;
}
.rounded h3.a_title {
  background: #468B00;
  color: #FFFFFF;
  font-size: 1.6em;
  padding: 0.5em 1em;
  margin-bottom: 0.5em;
}
ol {
  counter-reset: number;
  list-style-type: none !important;
}
ol li {
  position: relative;
  text-align: left;
  border-bottom: dashed 1px #FF5053;
  padding: 0.5em 0.5em 0.5em 3em;
  font-weight: bold;
  font-size: 1.2em;
  line-height: 1.6em;
}
ol li:before {
  /* 以下数字をつける */
  font-size: 1.3em;
  position: absolute;
  counter-increment: number;
  content: counter(number);
  /*以下数字のデザイン変える*/
  display: inline-block;
  background: #FF5053;
  color: white;
  font-family: 'Avenir', 'Arial Black', 'Arial', sans-serif;
  font-weight: bold;
  border-radius: 50%;
  left: 0;
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  /*以下 上下中央寄せのため*/
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
ol li:last-of-type {
  border-bottom: none; /*最後のliの線だけ消す*/
}
/*--------------------------------------------------------------------------------左右33% 横並び 3ボックス */
.product-frame {
  margin: 3em auto;
  width: calc(90%);
  text-align: center;
  background-color: #f5f5f7;
  border-radius: 20px;
  padding: 3em;
}
.product-frame h3 {
  color: var(--osusume-products-text-color);
  padding: 0 0 0.5em 0;
  border-bottom: 3px solid #A900CF;
  margin-top: 0;
}
.p_full_1 {
  width: calc(90%);
  margin: 2em auto;
}
.p_full_1 div.contents {
  text-align: center;
  border: solid 1px #555555;
  margin: 0 1em 1em;
  padding: 1em;
}
.p_full_1 div.contents h2 {
  color: var(--osusume-products-text-color);
  font-size: 1.8em;
  margin: 0;
  padding: 0 0 0.5em 0;
  border-bottom: 3px solid #8EC3FF;
  margin-top: 0;
}
.p_50_2 {
  display: flex;
  margin: 2em auto;
}
.p_50_2 div.contents {
  position: relative;
  text-align: center;
  border: solid 2px #008EE9;
  background: #EBEBEF;
  width: calc(50%);
  margin: 0 1em 1em;
  padding: 1em;
}
.p_50_2 div.contents p {
  width: 100%;
  padding: 0 1em;
}
.p_50_2 div.contents img {
  width: 90%;
  margin: 2em 0 0;
}
span.imp01 {
  position: absolute;
  font-size: 1em;
  display: inline-block;
  top: -0.3em;
  left: -0.3em;
  transform: rotate(-20deg);
  background: #20C300;
  padding: 0.3em;
  color: #FFFFFF;
}
.p_50_2 div.contents h2 {
  text-align: center;
  font-size: 1.8em;
  width: 100%;
  padding: 1em 0 1em;
  margin: 0;
  text-shadow: 3px 3px 2px #FFFD00, -3px 3px 2px #FFFD00, 3px -3px 2px #FFFD00, -3px -3px 2px #FFFD00, 3px 0px 2px #FFFD00, 0px 3px 2px #FFFD00, -3px 0px 2px #FFFD00, 0px -3px 2px #FFFD00; /* 文字の影 */
  color: var(--osusume-products-text-color);
}
.p_50_2 div.contents-black {
  text-align: center;
  border: solid 1px #C4C4C4;
  width: calc(50%);
  margin: 0 1em 1em;
  padding: 1em;
}
.p_33_3 {
  display: flex;
  width: calc(96%);
  margin: 2em auto;
}
.p_33_3 div.contents {
  text-align: center;
  width: calc(33.3%);
  margin: 0 1em;
  padding: 0;
  border-radius: 50%;
  background: #20C300;
  height: 130px;
  display: table;
}
.p_33_3 div.contents h2 {
  display: table-cell;
  vertical-align: middle;
  width: 100%;
  font-size: 1.6em;
  text-shadow: 3px 3px 2px #2DAA30, -3px 3px 2px #2DAA30, 3px -3px 2px #2DAA30, -3px -3px 2px #2DAA30, 3px 0px 2px #2DAA30, 0px 3px 2px #2DAA30, -3px 0px 2px #2DAA30, 0px -3px 2px #2DAA30; /* 文字の影 */
  color: #FFFFFF;
  text-align: center;
  font-weight: bold;
}
/*--------------------------------------------------------------------------------左右33% 横並び 3ボックス */
.p_33_3b {
  display: flex;
  width: 98%;
  margin: 0 auto;
}
.p_33_3b div.contents {
  text-align: center;
  border: solid 2px #20C300;
  width: calc(33.3%);
  margin: 0 1em 1em;
  padding: 1em;
  background: #FFFFFF;
}
.p_33_3b div.contents h2 {
  font-size: 1.7em;
  position: relative;
  padding: 0.3rem 0.3rem 0.3rem 1rem;
  margin: 0 0 1em;
  color: #00B775;
}
.p_25_4 {
  display: flex;
  width: calc(96%);
  margin: 0 auto;
}
.p_25_4 div.contents {
  border-radius: 20px;
  text-align: center;
  border: solid 3px #F4C912;
  width: calc(25%);
  margin: 0 0.8em;
  padding: 0;
  background-image: url(../img/bk_01.png);
  background-position: 100% 100%;
  background-repeat: no-repeat;
  background-size: contain;
}
.p_25_4 div.contents p {
  width: 100%;
  font-size: 1.2em;
  font-weight: bold;
  margin: 0;
  padding: 1em;
}
/*--------------------------------------------------------------------------------おすすめアイテム*/
.osusume-item {
  position: absolute;
  padding: 0 .5em;
  font-size: 1.3em;
  left: 20px;
  top: -15px;
  font-weight: bold;
  background-color: #fff; /* タイトル背景色 */
  color: #f09199; /* タイトル文字色 */
}
.p_item1set-name {
  font-size: 1.2em;
  line-height: 1.6em;
  margin: 2em auto 0;
  font-weight: bold;
}
/*--------------------------------------------------------------------------------商品紹介00*/
.cont-radius20 {
  margin: 0 auto 2em;
  width: calc(95%);
  text-align: center;
  background-color: #f5f5f7;
  border-radius: 20px;
  padding: 3em 3em 2em;
}
.product-con-normal {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.product-con-normal div.text {
  width: 100%;
}
.product-con-normal div.text p {
  margin: 0;
  padding: 0;
}
.product-con-normal div.imege {
  width: 100%;
  margin-left: 3%;
}
.product-con-normal div.image img {
  width: 100%;
  height: auto;
}
/*--------------------------------------------------------------------------------商品紹介01*/
.con-rev {
  border: 2px solid #000000; /* 枠線の太さ・色 */
}
.con-rev h2 {
  width: 100%;
  margin: 0;
  color: RED;
  padding: 0 0 0.5em 0;
  border-bottom: 3px solid #FFF100;
}
.con-rev .con {
  display: flex;
  margin: 5px 0;
  flex-direction: row;
}
.con-rev:nth-child(2n+1) {
  flex-direction: row;
} /* 奇数番目は左から右へ並べる */
.con-rev:nth-child(2n) {
  display: flex;
  flex-direction: row-reverse;
} /* 偶数番目は右から左へ並べる */
/*--------------------------------------------------------------------------------互い違いの枠*/
.con-rev {
  padding: 2em;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: 3em;
  background: hsla(0, 0%, 100%, 1.00);
}
.con-rev h2 {
  margin: 0;
}
.con-rev-text {
  width: 100%;
}
.con-rev-imege {
  width: 100%;
  margin-left: 3%;
}
.con-rev-imege img {
  width: 100%;
  height: auto;
}
.con-rev:nth-child(even) {
  flex-direction: row-reverse;
}
.con-rev:nth-child(even) .con-rev-text {
  text-align: right;
}
.con-rev:nth-child(even) .con-rev-imege {
  margin-left: 0;
  margin-right: 3%;
}
/*--------------------------------------------------------------------------------商品紹介01*/
.product-frame01 {
  margin: 3em auto;
  width: calc(90%);
  text-align: center;
  background-color: #f5f5f7;
  border-radius: 20px;
  padding: 3em;
  background-image: url(../img/bg_TV43B.jpg);
  background-repeat: no-repeat;
  background-position: left bottom;
}
.product-frame01 div.contents {
  display: flex;
}
.product-frame01 div.contents p {
  width: 50%;
  margin: 0 1.7em 0 0;
}
/*--------------------------------------------------------------------------------商品紹介02*/
.product-frame02 {
  margin: 3em auto;
  width: calc(90%);
  text-align: center;
  background-color: #f5f5f7;
  border-radius: 20px;
  padding: 3em;
  background-image: url(../img/bg_SPK300.jpg);
  background-repeat: no-repeat;
  background-position: left bottom;
}
.product-frame02 div.contents {
  display: flex;
}
.product-frame02 div.contents p {
  width: 50%;
  margin: 0 1.7em 0 0;
}
/*--------------------------------------------------------------------------------商品紹介03*/
.product-frame03 {
  margin: 3em auto;
  width: calc(90%);
  text-align: center;
  background-color: #f5f5f7;
  border-radius: 20px;
  padding: 3em;
  background-image: url(../img/bg_SD.jpg);
  background-repeat: no-repeat;
  background-position: left bottom;
}
.product-frame03 div.contents {
  display: flex;
}
.product-frame03 div.contents p {
  width: 50%;
  margin: 0 1.7em 0 0;
}
/*--------------------------------------------------------------------------------単独商品*/ :root {
  --osusume-products-base-color: #0025B7;
  --osusume-products-text-color: #0060BC;
  --osusume-products-color: #FFFFFF;
}
.osusume-products {
  text-align: center;
  background: #FFFFFF;
  padding: 0 3em 3em 3em;
  margin: 3em auto;
  border: 3px solid #f09199; /* 枠線の太さ・色 */
  box-shadow: 0 0 5px 3px #fce2c4 inset; /* 影の色 */
}
.osusume-products h3 {
  margin: 2em 0;
  font-size: 2.6rem;
  color: var(--osusume-products-text-color);
  padding: 0.2em 0 0.2em 1em;
  border-left: 13px solid #FF00F5;
}
.osusume-products div.contents {
  display: flex;
}
.osusume-products div.image01 {
  margin: 5em 0;
}
.osusume-products div p {
  width: 50%;
  margin: 0 0 0 1.7em;
}
.osusume-products div.g_package {
  width: 50%;
}
/*--------------------------------------------------------------------------------左右50% 横並び 2ボックス */
/*--------------------------------------------------------*/
.osusume-kakomi {
  position: relative;
  margin: 1em auto;
  background-color: #fff;
  border: 2px solid #f09199; /* 枠線の太さ・色 */
  box-shadow: 0 0 5px 2px #fce2c4 inset; /* 影の色 */
}
.osusume-kakomi div.centering {
  text-align: center;
  margin: 0 auto;
}
.p_item-set {
  display: flex;
}
.p_item-set div.product {
  text-align: center;
  width: calc(50% - 10px);
  margin: 1em auto;
  padding: 1.3em 1.3em 0;
}
.p_item-set div.product img {
  width: 85%;
  text-align: center;
  margin: 0 auto;
}
.p_item-set h1.name {
  text-align: center;
  font-size: 1.4em;
  margin: 2em 0;
}
/*--------------------------------------------------------------------------------リンク*/
.osusume-kakomi-2set {
  position: relative;
  margin: 4em auto 0;
  width: 95%;
  background-color: #fff;
  border: 2px solid #f09199; /* 枠線の太さ・色 */
  box-shadow: 0 0 5px 2px #fce2c4 inset; /* 影の色 */
}
.osusume-title {
  font-weight: bold;
  font-size: 1.3em;
  margin: 0.5em;
  line-height: 1.2em;
}
.osusume-item {
  position: absolute;
  padding: 0 .5em;
  font-size: 1.3em;
  left: 20px;
  top: -15px;
  font-weight: bold;
  background-color: #fff; /* タイトル背景色 */
  color: #f09199; /* タイトル文字色 */
}
/*--------------------------------------------------------------------------------左右50% 横並び 2ボックス */
.p_item2set {
  display: flex;
}
.p_item2set div.product {
  text-align: center;
  width: calc(50% - 10px);
  margin: 0em;
  padding: 1em 0 0 0;
}
.p_item2set div.name {
  margin: 0 0 2em;
}