@charset "UTF-8";
:root {
    background-color: #fafafa;
    font-family: Roboto, sans-serif;
}


/*--------------------------------------------------------------------
    !!! 色設定 !!!!
    ボタン、タイトルのライン等の色設定部分です。
    好きな色を入れてください

    ※ドリームウィーバー上で赤いエラーが出ていても問題ないです
-------------------------------------------------------------------- */

:root {
    
    /* ボタンの色 */
    --button_color: #bb030b;
    
    /* 発売商品ラインナップ等の 見出しのラインの色 */
    --line_color: #92c6eb;
    
    /* 商品名の背景色 */
    --item_color: #dff1fd;

    /* 商品名下のラインの色 */
    --under_line_color: #92c6eb;
}

/* 色設定 END ------------------------------------------------------- */


body {
    background-color: #fff;
}
.inline_B {
    display: inline-block;
}
/* -------------------------------------------------------------------- */
#content .sp_only {
    display: none;
}
#content .sp_only_400 {
    display: none;
}
#content .imgWrap .pc_only {
    display: inline;
}
@media only screen and (max-width: 767px) {
    #content .pc_only {
        display: none;
    }
    #content .sp_only {
        display: inherit;
    }
}
@media only screen and (max-width: 400px) {
    #content .pc_only_400 {
        display: none;
    }
    #content .sp_only_400 {
        display: inherit;
    }
}
/* -------------------------------------------------------------------- */
.please {
    width: 95%;
    border: 1px #000 solid;
    padding: 15px;
    color: #000;
    font-weight: bold;
    font-size: 15px;
    margin: 10px auto 40px;
    position: relative;
}
.please, .please * {
    box-sizing: border-box;
}
.please .ttl {
    font-weight: bold;
    font-size: 1.1rem;
    padding-bottom: 5px;
}
.please li {
    margin-left: 1rem;
    text-indent: -1rem;
}
@media only screen and (max-width: 767px) {
    .please {
        padding: 10px;
        width: 96%;
    }
}
/*header -------------------------------*/
#mv_img {
    width: 100%;
}
#mv_img h2 {
    width: 970px;
    margin: 0 auto;
    background-color: #ffffff;
}
/*article -------------------------------*/
article {
    width: 100%;
    padding-bottom: 40px;
}
article #content {
    width: 970px;
    margin: 0 auto;
}
.content_00 {
    overflow: hidden;
}
.content_00 h2 {
    padding-bottom: 20px;
    font-weight: bold;
    font-size: 160%;
    text-align: center;
}
.content_00 h2 img {
    max-width: 100%;
}
.content_00 h3 {
    clear: both;
    margin: 35px 0 20px;
    padding-left: 5px;
    font-weight: bold;
    font-size: 120%;
    border-left:10px solid var(--line_color);/* ------------- */
    border-bottom:2px solid var(--line_color);/* ------------- */
}
.desc {
    font-size: 105%;
    margin-top: 20px;
}
.desc_ttl {
    font-weight: bold;
    font-size: 120%;
}
.lead {
    margin-top: 10px;
}
.ivent_detail {
    margin: 30px 10px 0 10px;
}
.ivent_ttl {
    font-size: 120%;
    font-weight: bold;
}
.store_list {
    clear: left;
    margin: 10px 10px 0 10px;
    padding: 10px;
    border: 1px solid #000;
}
.tostorelist {
    text-align: center;
    margin-bottom: 30px;
    margin-top: 20px;
}
.app {
    text-align: left;
    margin-top: 10px;
}
.tostore_att {
    text-align: center;
    color: #f00;
}
.ivent_in {
    margin: 0 0 10px 1em;
}
/* 商品ラインナップ----------------------------- */
.item_left {
    float: left;
}
.item_right {
    float: right;
}
.item_left, .item_right {
    width: 48%;
    margin: 0 1% 25px;
}
.item_left .imgWrap, .item_right .imgWrap {
    text-align: center;
    margin: 20px 0 5px;
}
.item_left img, .item_right img {
    width: 95%;
}
.item_file {
    clear: both;
    margin: 0;
}
/*
.item_file .imgWrap{
display:inline-block;
overflow:hidden;
width:47%;
margin:0 1% 25px;
}
.item_file img{
width:95%;
margin-bottom:5px;
}
.item_file .imgWrap p{
text-align:center;
}
*/
h4.item_name {
    margin-bottom: 10px;
    padding: 15px 20px;
    color: #000000;
    font-size: 100%;
    font-weight: bold;
    background:var(--item_color);/* ------------- */
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    font-family: 'Noto Sans JP', sans-serif;
}
.itemsize {
    margin: 0 0 30px 10px;
    font-size: 110%;
    font-weight: bold;
    word-break: break-all;
}
.sent {
    margin: 0 0 0px 1rem;
}
.h4tokuten {
    font-size: 105%;
    font-weight: bold;
    margin-bottom: 20px;
}
.tokuten_img img {
    max-width: 640px;
    margin: 10px auto;
    display: block;
}
.h4tokuten_ttl {
    font-size: 130%;
    font-weight: bold;
    margin-bottom: 20px;
}
.tokutenset {
    overflow: hidden;
    margin: 30px 15px 60px;
    padding: 10px;
    border: 4px double #5D8496;
}
.tokuten_txt {
    color: #2445AC;
    font-size: 180%;
    font-weight: bold;
    text-align: center;
}
.tokutensetWrap {
    position: relative;
    float: left;
    width: 23%;
    margin: 10px 1%;
}
.tokutensetWrap img {
    width: 100%;
    border: 1px solid #2954BD;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
.tokutensetWrap p {
    text-align: center;
}
.tokutensetWrap .new {
    position: absolute;
    width: 30%;
    top: 0;
    left: 0;
    border: none;
}
h3#coution {
    border-left: 10px solid #d29757;
    border-bottom: 2px solid #d29757;
}
.coution_detail {
    margin: 0 0 20px 25px;
    list-style-type: disc;
}
#info {
    margin: 20px 15px 50px;
    padding: 20px;
    border: 4px double #394667;
}
.contact_url {
    clear: both;
    margin: 30px 0 30px 0px;
}
/*
.logo{
display:inline-block;
margin-top:10px;
}
*/
.logo:hover {
    opacity: 0.8;
}
.red {
    clear: both;
    color: red;
    font-size: 85%;
}
.red2 {
    color: red;
    font-size: 100%;
    font-weight: bold;
}
.large_txt {
    font-size: 130%;
    color: #2f4f4f;
}
.info_detail01 #word-break {
    word-break: break-all;
}
/*footer -------------------------------*/
footer {
    width: 100%;
    background: #000000; /* ------------- */
    overflow: hidden;
    border-top: 1px solid #ccc;
}
footer, footer * {
    box-sizing: border-box;
}
footer #copy {
    width: 970px;
    margin: 0 auto;
    padding: 20px 0;
    line-height: 1.2em;
    font-size: 90%;
    text-align: left;
    font-weight: bold;
    color: #fff;
}
footer #copy_text {
    float: left;
}
/*970 -------------------------------*/
@media only screen and (max-width: 970px) {
    article #content, footer #copy {
        width: 100%;
    }
    .content_00 {
        padding: 0 10px;
    }
    footer #copy {
        padding: 20px 5px 20px 10px;
    }
}
/*767 -------------------------------*/
@media only screen and (max-width: 767px) {
    .content_00 h2 {
        margin: 0 0 20px;
        padding-bottom: 5px;
        font-weight: bold;
        font-size: 130%;
        line-height: 1.2em;
    }
    #mv_box {
        float: none;
        width: 100%;
        margin: 0 0 10px 0;
    }
    .ivent_in {
        margin: 0 0 10px 0;
    }
    .ivent_detail {
        clear: left;
        margin-top: 20px;
        padding: 10px;
    }
    .item_left, .item_right {
        float: none;
        width: 98%;
    }
    .item_file .imgWrap {
        width: 90%;
        display: block;
        text-align: center;
    }
    .item_file img {
        width: 85%;
    }
    #content .imgWrap .sp_only {
        display: inline;
    }
    #content .imgWrap .pc_only {
        display: none;
    }
    .tokutenset {
        margin: 20px 8px 50px;
    }
    .tokutensetWrap {
        float: left;
        width: 45%;
        margin: 10px 2%;
    }
    .tokutensetWrap p {
        font-size: 90%;
    }
    #info {
        margin: 30px 8px 50px;
    }
    .tokuten_img img {
        width: 90%;
    }
    .sent {
        margin: 0 0 0px 1rem;
    }
    .app {
        text-align: center;
    }
    .info_detail01 .word-break {
        word-break: break-all;
    }
}
/* botton */
button,
.button {
  display: inline-block;
  margin: 0.75rem;
  padding: 0.78rem 1.5rem 0.75rem;
  border: none;
  border-radius: 0.1875rem;
  outline: none;
  background-color: var(--button_color);
  color: #ffffff;
  font-family: inherit;
  font-size: 1.125em;
  font-weight: 600;
  line-height: 1.5rem;
  text-decoration: none;
  cursor: pointer;
  -webkit-transition: all 150ms ease-out;
  transition: all 150ms ease-out;
  box-shadow: 0 0 0 0.1875rem white, 0 0 0 0.375rem var(--button_color);
}
button:focus, button:hover,
.button:focus,
.button:hover {
	color: var(--button_color);
    background-color: #ffffff;
    box-shadow: 0 0 0 0.1875rem white, 0 0 0 0.375rem var(--button_color);
}

button:active,
.button:active {
  background-color: #ffffff;
  box-shadow: 0 0 0 0.1875rem white, 0 0 0 0.375rem var(--button_color);
  -webkit-transition-duration: 75ms;
          transition-duration: 75ms;
}
button.outline,
.button.outline {
  border: 0.1875rem solid #000000;
  background-color: transparent;
  color: tomato;
}
button.outline:focus, button.outline:hover,
.button.outline:focus,
.button.outline:hover {
  border-color: #fff;
  color: #000000;
}
button.outline:active,
.button.outline:active {
  border-color: #fff;
  color: #000000;
}

/* botton2 */
.button2 {
    display: inline-block;
    margin: 0.75rem;
    padding: 0.78rem 0rem 0.75rem;
    background-color: #ffffff;
    color: #000000;
    -webkit-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    text-decoration: none;
    font-weight: bold;
    font-size: 1.125em;
}
.button2:hover {
    color: #000000;
    opacity: 0.7;
}
.button2 img {
    margin: 10px 0;
    max-width: 300px;
    width: 100%;
}
/* app bottan */
.btn_flex {
    display: block;
    margin-top: 10px;
}
.btn_flex a {
    display: inline-block;
    padding-bottom: 10px;
}
@media print, screen and (min-width: 769px) {
    .btn_flex a {
        margin-right: 20px;
    }
}
@media only screen and (max-width: 767px) {
    .btn_flex {
        text-align: center;
    }
}
.app button, .app .button {
    display: inline-block;
    padding: 1.2rem 1.8rem;
    border: none;
    border-radius: 8px;
    outline: none;
    background-color: #000000;
    color: #fff;
    font-family: inherit;
    font-size: 1.125em;
    font-weight: 600;
    line-height: 1.5rem;
    text-decoration: none;
    cursor: pointer;
    -webkit-transition: all 150ms ease-out;
    transition: all 150ms ease-out;
}
.app button:focus, .app button:hover, .app .button:focus, .app .button:hover {
    color: #000000;
    background-color: #fff;
    box-shadow: 0 0 0 0.1875rem white, 0 0 0 0.375rem #000000;
}
.app button:active, .app .button:active {
    background-color: #fff;
    box-shadow: 0 0 0 0.1875rem #000000, 0 0 0 0.375rem #000000;
    -webkit-transition-duration: 75ms;
    transition-duration: 75ms;
}
.app button.outline, .app .button.outline {
    border: 0.1875rem solid #000000;
    background-color: transparent;
    color: tomato;
}
.app button.outline:focus, .app button.outline:hover, .app .button.outline:focus, .app .button.outline:hover {
    border-color: #fff;
    color: #000000;
}
.app button.outline:active, .app .button.outline:active {
    border-color: #fff;
    color: #000000;
}
/* 201106 追記
-------------------------------------------------------------------- */
.block_01, .block_02, .block_03, .block_04 {
    clear: both;
}
.block_02, .block_03 {
    padding-top: 40px;
}
.block_04 {
    padding-top: 60px;
}
/* 小見出し */
.ttl_sub {
    border-left: 8px double #000;
    font-size: 120%;
    font-weight: bold;
    margin-bottom: 20px;
    padding: 0.2rem 0.4rem;
}
/**/
.item_file .imgWrap {
    float: left;
    display: inline-block;
    overflow: hidden;
    width: 49%;
    margin: 0px 0.5% 25px;
}
@media only screen and (max-width: 767px) {
    .item_file .imgWrap {
        width: 95%;
        display: block;
        text-align: center;
    }
}
/* プロフィール
---------------------------------*/
#content_prof {
    padding: 0 20px;
    margin-top: 80px;
}
#content_prof .box_prof {
    align-items: center;
    display: flex;
    justify-content: space-around;
    margin-bottom: 40px;
}
#content_prof .box_prof .img {
    width: 25%;
}
#content_prof .box_prof .img img {
    width: 100%;
}
#content_prof .box_prof .txt {
    width: 65%;
    /* 枠 */
    border: 1px solid;
    padding: 15px;
}
/* 区切り */
#content_prof hr {
    margin: 60px auto;
}
/* 動画 */
#content_prof iframe {
    display: block;
    margin: 0 auto;
}
@media only screen and (max-width: 767px) {
    #content_prof {
        padding: 0;
    }
    #content_prof .box_prof {
        flex-direction: column;
    }
    #content_prof .box_prof .img {
        margin-bottom: 10px;
        width: 40%;
    }
    #content_prof .box_prof .txt {
        width: 70%;
    }
}
.receipt {
    width: 80%;
    margin: 20px 15px 50px;
    border: 4px double #394667;
    max-width: 640px;
}
@media only screen and (max-width: 767px) {
    .receipt {
        width: 90%;
    }
}
.tag_name {
    display: inline-block;
    font-weight: bold;
}
.item_wide {
    margin: 0 auto;
    width: 98%;
}
.temp_left05 {
    display: inline-block;
    text-indent: -0.5rem;
}
.temp_left05_b {
    display: inline-block;
    font-weight: bold;
    text-indent: -0.5rem;
}
.v_frame {
    text-align: center;
}
.v_frame span {
    font-size: 120%;
    font-weight: bold;
}
.youtube_wrap {
    position: relative;
    padding-bottom: 56.3%;
    height: 0;
    overflow: hidden;
    margin: 0 auto;
    width: 100%;
    max-width: 970px;
}
.youtube_wrap iframe {
    max-width: 100%;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
}
.under_line {
    font-weight: bold;
    display: block;
    border-bottom: 2px solid var(--under_line_color);
    font-size: 120%;
    margin-bottom: 8px;
    padding-bottom: 8px;
}