@charset "utf-8";
/*  style.css
---------------------------------------------- */

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

/****** common ******/
.inner {
    width: 960px;
    margin: 0 auto;
}
input::placeholder {
    color: #CCC;
}
#clm_2 {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
main {
    width: 960px;
    /*margin: 25px auto 0;*/
    margin: 15px auto 0;
}
.btn {
    display: block;
    width: 280px;
    padding: 15px 0;
    background: #FFF;
    border: 1px solid #707070;
    border-radius: 30px;
    text-align: center;
    font-size: 14px;
}
.btn_s {
    display: block;
    padding: 12px 0;
    background: #FFF;
    border: 1px solid #707070;
    border-radius: 30px;
    text-align: center;
    font-size: 12px;
}
.bold {
    font-weight: bold;
}

.info_detail{
    display: inline-block;
    margin-left: 4px;
    width: 20px;
    border-radius: 10px;
    background: #aaa;
    color: #FFF;
    font-weight: bold;
    text-align: center;
    line-height: 20px;
    font-size:15px;
    cursor:pointer;
}

/****** pagetop ******/
.pagetop_link {
    display: none;
    position: fixed;
    right: 15px;
    bottom: 15px;
    width: 150px;
    padding: 10px 0;
    background: #33acbb;
    border-radius: 5px;
    color: #FFF !important;
    font-size: 12px;
    text-align: center;
}
.pagetop_link:hover {
    opacity: 0.7;
    text-decoration: none;
}
.pagetop_link i {
    margin-right: 10px;
}
#product_search .pagetop_link {
    bottom: 120px;
}

/****** password_view ******/
.password_view{
    position: relative;
}
.password_view_icon{
    position: absolute;
    top: 25px;
    right: 20px;
}
.password_view_icon input{
    display: none;
}

/****** autocomplete base ******/
.ui-autocomplete {
    display: inherit;
    top: 43px !important;
    border-radius: 10px;
    z-index: 9999 !important;
}
.ui-autocomplete li {
    width: 100% !important;
    padding: 10px 15px !important;
    font-size: 14px;
    font-weight: normal;
    text-align: left !important;
}
.ui-autocomplete li:first-child {
    padding-top: 20px !important;
}
.ui-autocomplete li:last-child {
    padding-bottom: 20px !important;
}
.ui-state-active {
    margin: 0 !important;
    background: none !important;
    color: #eb5591 !important;
    border: none !important;
}

/****** color base ******/
.bg_green {
    border: none !important;
    background: #0098AA !important;
    color: #FFF !important;
}
.bg_gray {
    border: none !important;
    background: #B8BEC4 !important;
    color: #FFF !important;
}
.bg_blue {
    border: none !important;
    background: #6392E2 !important;
    color: #FFF !important;
}
.bg_yellow {
    border: none !important;
    background: #f28813 !important;
    color: #FFF !important;
}
.bg_brown {
    border: none !important;
    background: #836e50 !important;
    color: #FFF !important;
}
.bg_red {
    border: none !important;
    background: #EB5591 !important;
    color: #FFF !important;
}

.color_red {
    color: #EB5591;
}

.color_gray {
    color: #666;
}
/****** loading animation - white ******/

.loading_cursor{
    cursor:wait !important;
}

.loader_for_btn {
    display:none;
    font-size: 4px;
    width: 1.2em;
    height: 1.2em;
	position: absolute;
	/*top: 4px;*/
    top: 34%;
	right: -25px;
}

/*.loader_for_btn_mini {
    display:none;
    font-size: 4px;
    width: 1em;
    height: 1em;
    top: 14px;
    right: 14px;
}*/

.loader_w {
	border-radius: 50%;
	text-indent: -9999em;
	-webkit-animation: load_ani 1.1s infinite ease;
	animation: load_ani 0.7s infinite ease;
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	transform: translateZ(0);
	position: absolute;
	overflow: hidden;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
@-webkit-keyframes load_ani {
    0%,
    100% {
    box-shadow: 0em -2.6em 0em 0em #ffffff, 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.5), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7);
    }
    12.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.7), 1.8em -1.8em 0 0em #ffffff, 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5);
    }
    25% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.5), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7), 2.5em 0em 0 0em #ffffff, 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }
    37.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5), 2.5em 0em 0 0em rgba(255, 255, 255, 0.7), 1.75em 1.75em 0 0em #ffffff, 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }
    50% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.5), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.7), 0em 2.5em 0 0em #ffffff, -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }
    62.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.5), 0em 2.5em 0 0em rgba(255, 255, 255, 0.7), -1.8em 1.8em 0 0em #ffffff, -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }
    75% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.5), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.7), -2.6em 0em 0 0em #ffffff, -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }
    87.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.5), -2.6em 0em 0 0em rgba(255, 255, 255, 0.7), -1.8em -1.8em 0 0em #ffffff;
    }
}
@keyframes load_ani {
    0%,
    100% {
    box-shadow: 0em -2.6em 0em 0em #ffffff, 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.5), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7);
    }
    12.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.7), 1.8em -1.8em 0 0em #ffffff, 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5);
    }
    25% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.5), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7), 2.5em 0em 0 0em #ffffff, 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }
    37.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5), 2.5em 0em 0 0em rgba(255, 255, 255, 0.7), 1.75em 1.75em 0 0em #ffffff, 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }
    50% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.5), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.7), 0em 2.5em 0 0em #ffffff, -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }
    62.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.5), 0em 2.5em 0 0em rgba(255, 255, 255, 0.7), -1.8em 1.8em 0 0em #ffffff, -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }
    75% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.5), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.7), -2.6em 0em 0 0em #ffffff, -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
    }
    87.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.5), -2.6em 0em 0 0em rgba(255, 255, 255, 0.7), -1.8em -1.8em 0 0em #ffffff;
    }
}
    



/****** pankuzu base ******/
#pankuzu {
    margin-bottom: 50px;
    padding-bottom: 15px;
    border-bottom: 1px solid #CCC;
}
#pankuzu ul li {
    display: inline-block;
    font-size: 12px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
}
#product_list #pankuzu ul li:not(:last-child) span::after {
    content: '/';
    margin: 0 0 0 5px;
}
#pankuzu ul li a {
    color: #000;
}
#pankuzu ul li:not(:last-child)  a::after {
    content: '>';
    margin: 0 0 0 5px;
}
#pankuzu ul li:hover a {
    color: #EB5591;
    text-decoration: none;
}
#pankuzu ul li:hover a::after {
    color: #000;
}

/****** page_title base ******/
#page_title {
    position: relative;
    margin-bottom: 50px;
    padding-bottom: 50px;
}
#page_title h1,
#page_title h2 {
    position: relative;
    padding-left: 35px;
    font-size: 24px;
    font-weight: bold;
    line-height: 1.2em;
}
#page_title h1::before,
#page_title h2::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0;
    width: 26px;
    height: 26px;
}
#page_title .search_word_title {
    position: relative;
    /*padding-left: 35px;*/
    font-size: 24px;
    font-weight: bold;
    line-height: 1.2em;
    margin:0 20px 0 0;
}
/*
#page_title .search_word_title::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0;
    width: 26px;
    height: 26px;
}*/
#page_title.entry_page h2::before {
    background-image: url("../../img/common/icon/icon_mypage.svg");
}
#page_title.cart_page h2::before {
    background-image: url("../../img/common/icon/icon_cart.svg");
}
#page_title.login_page h2::before {
    background-image: url("../../img/common/icon/icon_login.svg");
}
#page_title.download_page h2::before {
    background-image: url("../../img/common/icon/icon_download.svg");
}
#page_title.convenience_page h1::before,
#page_title.convenience_page h2::before {
    background-image: url("../../img/common/icon/icon_convenience.svg");
}
#page_title.product_list_page h1::before,
#page_title.product_list_page h2::before {
    background-image: url("../../img/common/icon/icon_search.svg");
}
/*
#page_title.product_list_page .search_word_title::before {
    background-image: url("../../img/common/icon/icon_search.svg");
}*/
#page_title.product_search_page h1::before,
#page_title.product_search_page h2::before {
    background-image: url("../../img/common/icon/icon_search.svg");
}
#page_title.topic_page h2::before {
    background-image: url("../../img/common/icon/icon_note.svg");
}
#page_title.contact_page h2::before {
    background-image: url("../../img/common/icon/icon_contact.svg");
}
#page_title.redownload_page h2::before {
    background-image: url("../../img/common/icon/icon_redownload.svg");
}
#page_title.my_page h2::before {
    background-image: url("../../img/common/icon/icon_mypage.svg");
}
#page_title.sfss_page h2::before {
    background-image: url("../../img/common/icon/icon_school.svg");
}
#page_title.artist_page h1::before,
#page_title.artist_page h2::before {
    background-image: url("../../img/common/icon/icon_artist.svg");
}
#page_title.faq_page h1::before,
#page_title.faq_page h2::before {
    background-image: url("../../img/common/icon/icon_question.svg");
}
#page_title.tokushu_page h1::before,
#page_title.tokushu_page h2::before {
    background-image: url("../../img/common/icon/icon_gakufu.svg");
}
#page_title.privacy_page h1::before,
#page_title.privacy_page h2::before {
    background-image: url("../../img/common/icon/icon_privacy.svg");
}
#page_title.gakki_page h1::before,
#page_title.gakki_page h2::before {
    background-image: url("../../img/common/icon/icon_gakki.svg");
}
#page_title.publisher_page h1::before,
#page_title.publisher_page h2::before {
    background-image: url("../../img/publisher/icon_onpu.svg");
}
#page_title.payment_page h1::before,
#page_title.payment_page h2::before {
    background-image: url("../../img/common/icon/icon_payment.svg");
}
#page_title.preparation_page h1::before,
#page_title.preparation_page h2::before{
    background-image: url("../../img/common/icon/icon_necessary.svg");
}
#page_title.quality_page h1::before,
#page_title.quality_page h2::before {
    background-image: url("../../img/common/icon/icon_check.svg");
}
#page_title.experience_page h1::before,
#page_title.experience_page h2::before {
        background-image: url("../../img/common/icon/icon_experience.svg");
}
#page_title.mailmagazine_page h2::before {
    background-image: url("../../img/common/icon/icon_contact.svg");
}
#page_title.about_page h1::before,
#page_title.about_page h2::before {
    background-image: url("../../img/common/icon/icon_about.svg");
}
#page_title p {
    margin-top: 15px;
    font-size: 12px;
    line-height: 2em;
}
#page_title .pagelink {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 25px;
}
#page_title .pagelink li {
    position: relative;
    width: 22%;
    border: 1px solid #707070;
    border-radius: 30px;
}
#page_title .pagelink li::after {
    /*content: '\f13a';*/
    content: '▼';
    position: absolute;
    top: 13px;
    right: 15px;
    /*font-family: FontAwesome;*/
    font-size: 12px;
}
#page_title .pagelink li a {
    display: block;
    padding: 10px 0;
    font-size: 14px;
    color: #000;
    text-align: center;
}
#page_title .pagelink li a:hover {
    opacity: 0.7;
    text-decoration: none;
}

/****** subtitle base ******/
.subtitle {
    position: relative;
    display: flex;
    justify-content: space-between;
    padding-bottom: 20px;
    line-height: 1.3em;
}
.line_blue::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 5px;
    background-image: -webkit-linear-gradient(-45deg, #33acbb 25%, #FFF 25%, #FFF 50%, #33acbb 50%, #33acbb 75%, #FFF 75%, #FFF);
    background-image: -o-linear-gradient(-45deg, #33acbb 25%, #FFF 25%, #FFF 50%, #33acbb 50%, #33acbb 75%, #FFF 75%, #FFF);
    background-image: linear-gradient(-45deg, #33acbb 25%, #FFF 25%, #FFF 50%, #33acbb 50%, #33acbb 75%, #FFF 75%, #FFF);
    background-size: 10px 10px;
}
#product_detail .line_blue::after {
    content: none;
}
.line_black::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 5px;
    background-image: -webkit-linear-gradient(-45deg, #666 25%, #FFF 25%, #FFF 50%, #666 50%, #666 75%, #FFF 75%, #FFF);
    background-image: -o-linear-gradient(-45deg, #666 25%, #FFF 25%, #FFF 50%, #666 50%, #666 75%, #FFF 75%, #FFF);
    background-image: linear-gradient(-45deg, #666 25%, #FFF 25%, #FFF 50%, #666 50%, #666 75%, #FFF 75%, #FFF);
    background-size: 10px 10px;
}
.subtitle div {
    display: flex;
}
.subtitle h2 {
    position: relative;
    margin-right: 10px;
    padding-left: 25px;
    font-size: 20px;
    font-weight: bold;
    line-height: 1em;
}
.subtitle h2::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 18px;
    height: 18px;
    background-size: cover;
}
.subtitle span {
    font-size: 12px;
    color: #666;
}
.subtitle a {
    font-size: 12px;
    color: #000;
}
.subtitle a:hover {
    color: #EB5591;
}
.subtitle a::before {
    /*content: '\f138';*/
    content: '▶';
    display: inline-block;
    margin-right: 5px;
    /*font-family: FontAwesome;*/
}

/****** midashi_title base ******/
.midashi_title {
    /*margin-bottom: 25px;*/
    margin-bottom: 15px;
    padding-left: 10px;
    border-left: 5px solid #0098AA;
    font-size: 20px;
    font-weight: bold;
}

/****** topic_list base ******/
.topic_list {
    padding: 20px 0 0 10px;
    border-bottom: 1px solid #CCC;
}
.topic_list li {
    padding-bottom: 15px;
}
.topic_list li:last-child {
    padding-bottom: 20px;
}
.topic_list li a {
    font-size: 14px;
    color: #AAA;
    font-weight: bold;
    text-decoration: none;
}
.topic_list li span {
    display: inline-block;
    margin-left: 15px;
    font-size: 14px;
    color: #000;
    font-weight: normal;
}
.topic_list li a:hover,
.topic_list li a:hover span {
    color: #EB5591;
}
.topic_list li .icon_new {
    position: relative;
    padding-left: 25px;
}
.topic_list li .icon_new::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0;
    width: 20px;
    height: 20px;
    background-image: url("../../img/common/icon/icon_new.svg");
}

/****** sns_icon base ******/
.sns_icon a span {
    position: relative;
    padding-left: 15px;
}
.sns_icon a span::before {
    display: inline-block;
    position: absolute;
    top: -3px;
    left: -15px;
    /*font-family: FontAwesome;*/
    font-size: 20px;
}
.icon_twitter a {
    background: #65B3EE;
}
.icon_line a {
    background: #06C755;
}
.icon_facebook a {
    background: #3B5999;
}
.icon_twitter a span::before {
    /*content: '\f099';*/
    content: '𝕏';
}
.icon_line a span::before {
    /*content: '\f3c0';*/
    content: '';
}
.icon_facebook a span::before {
    /*content: '\f09a';*/
    content: '';
}

/****** modal base ******/
.fixed {
	position: fixed;
	left: 0;
	width: 100%;
	height: 100%;
}
.modal {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
    z-index: 9997;
	width: 100%;
	height: 100vh;
}
.modal .modal_overray {
	position: absolute;
	z-index: 9998;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: rgba(0, 0, 0, 0.8);
}
.modal .modal_inner {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	box-sizing: border-box;
	z-index: 9999;
}
.modal .modal_inner .btn {
    width: 280px;
}
.modal .modal_close_btn {
	position: absolute;
	right: 25px;
	top: 25px;
    z-index: 9998;
	color: #FFF;
    font-size: 60px;
	text-align: center;
	line-height: 20px;
	cursor: pointer;
}
.modal.modal_content_sample .modal_inner {
    /*width: 596px;*/
    width: 660px;
	/*max-height: 80vh;*/
    max-height: 90vh;
    /*max-height: 95vh;*/
	/*padding: 30px;*/
    padding: 20px;
    /*background: #FFF;*/
    background: #F6F5F1;
    overflow-y: scroll;
    text-align:center;
}
.modal.modal_content_sample .modal_inner img{
    box-shadow: 0px 0px 10px 0px rgba(200,200,200,0.3);
    background: #fff;
}
/*
.modal.modal_content_sample .modal_goods_detail {
	color: #666;
}*/
.modal.modal_content_sample .modal_inner.to_detail{
    top: 97%;
    left: 50%;
    overflow-y: hidden;
    background: none;
    top: 97%;
    width: auto;
}
.modal .modal_inner.to_detail a{
    color:#fff;
    text-decoration:underline;
    font-size:18px;
}


.modal.modal_content_movie .modal_inner {
    /*position: relative;*/
    width: 80%;
    padding-top: 48%;
}
.modal.modal_content_movie .modal_inner iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100% !important;
    height: 100% !important;
}

/****** item base ******/
.item_wrap .item {
    position: relative;
    display: flex;
    justify-content: space-between;
    /*padding: 25px 5px;*/
    /*padding: 25px 0 25px 15px;*/
    padding: 25px 0 25px 20px;
    border-bottom: 1px solid #CCC;
}
.item_wrap2 .item_gakki {
    margin: -5px 15px 0 0;    
    font-size: 34px;
}
.item_wrap .item .item_info {
    width: calc(65% - 36px);
    line-height: 1.3em;
}
#new .item_wrap .item .item_info,
#detail_item .item_wrap .item .item_info {
    /*width: 62%;*/
    width: 60%;
}
#ranking .item_wrap .item .item_info {
    width: calc(62% - 30px);
}
#product_detail .item_wrap .item .item_info {
    /*width: calc(75% - 64px);*/
    width: calc(75% - 70px);
}

.item_wrap2 .item .item_info {
    /*width: calc(65% - 36px);*/
    /*width: calc(67% - 62px);*/
    /*width: calc(67% - 80px);*/
    width: calc(67% - 20px);
}
.item_wrap .item .item_info .item_title_artist_wrapper{
    min-height:64px;
}
.item_wrap .item .item_info a {
    display: block;
    color: #000;
}
.item_wrap .item .item_info a:visited,
.item_wrap .item .item_info a:visited .item_text  {
    /*
    color: #888;
    color: #551A8B;
    color: #891A23;
    color: #877272;
    color: #808080;
*/
color: #787878;
}
#cart .item_wrap .item .item_info a:visited,
#cart .item_wrap .item .item_info a:visited .item_text  {
    color: #000;
}
.item_wrap .item .item_info a:hover,
.item_wrap .item .item_info a:hover .item_text {
    color: #EB5591;
}
.item_wrap .item_info h3 {
    font-size: 18px;
    line-height: 1.2em;
    font-weight: bold;
}
#homepage .item_wrap .item_info h3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    white-space: normal;
}
.item_wrap .item .item_info a h3{
	text-decoration: underline;
	text-decoration-color: #ccc;
}
#product_detail .item_wrap .item_info h1 {
    /*font-size: 18px;*/
	font-size: 24px;
    /*line-height: 1.25em;*/
    line-height: 1.2em;
    font-weight: bold;
}
.item_wrap .item_info .item_tieup {
    color: #999;
}
.item_wrap .item_info .item_artist {
    display: block;
    font-size: 12px;
}
#product_detail .item_wrap .item_info .item_artist {
    /*margin-top:3px;*/
}
.item_wrap .item_info .item_text {
    display: block;
    /* width: 280px; */
    margin-right: 10px;
    /*margin-top: 5px;*/
    font-size: 12px;
    color: #666;
}
#product_detail .item_wrap .item_info .item_text {
    font-weight: normal !important;
    margin-right: 0;
    margin-top: 0;
  }
.item_wrap .item_info .buy_suu {
    margin-top: 5px;
    font-size: 12px;
}
.item_wrap .item_fav {
    display: inline-block !important;
    margin-top: 5px;
    font-size: 12px;
    /*color: #666 !important;*/
	color: #999 !important;
    cursor: pointer;
}
.item_wrap ul.item_icon li.item_fav_wrap .item_fav {
    /*margin-top: 6.5px;
    font-size: 14px;*/
    font-size: 16px;
}
.item_wrap .item_fav::before,
.item_wrap_grid .item_fav::before {
    /*content: '\f004';*/
    /*content: '❤';*/
    content: '♡';
    display: inline-block;
    margin-right: 5px;
    /*font-family: FontAwesome;*/
}
.item_wrap ul.item_icon li.item_fav_wrap .item_fav::before{
    /*margin-left: 7.5px;*/
    margin:3px 0 0 10px;
}
.item_wrap .item_fav.active::before,
.item_wrap_grid .item_fav.active::before {
    /*font-family: 'Font Awesome 5 Free';*/
    font-weight: 600;
    color: #EB5591;
}
.item_wrap .item_fav,
.item_wrap_grid .item_fav {
    display: block;
    margin-top: 5px;
    font-size: 12px;
    /*color: #666 !important;*/
	color: #999 !important;
    cursor: pointer;
}
.item_wrap_grid .item_fav {
    margin-top: 1px;
}
.item_wrap_grid .item_price p::before {
    content: '';
    position: absolute;
    top: 2px;
    left: 0;
    width: 15px;
    height: 15px;
}
.item_info h3,
.item_info .item_artist,
.item_info .item_text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#product_detail #detail_title .item_info h3 {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
}
.item_wrap .item_price {
    display: flex;
    justify-content: flex-end;
    width: 35%;
    /*width: 33%;*/
}
#product_detail .item_wrap .item_price {
    width: 25%;
}
.item_wrap .item_price p {
    position: relative;
    /*margin-left: 15px;*/
    margin-left: 10px;
    padding-left: 22px;
    font-size: 18px;
    font-weight: bold;
    color: #FF3737;
}
.item_wrap .item_price p::before {
    content: '';
    position: absolute;
    top: 3px;
    left: 0;
    width: 20px;
    height: 20px;
}
.icon_download::before { background-image: url("../../img/common/icon/icon_download_gray.svg"); }
.icon_convenience::before { background-image: url("../../img/common/icon/icon_convenience_gray.svg"); }
.icon_convenience_white::before { background-image: url("../../img/common/icon/icon_convenience_white.svg"); }
.icon_music::before { background-image: url("../../img/common/icon/icon_music_gray.svg"); }
.item_wrap .item_icon {
    position: absolute;
    display: flex;
    /*justify-content: flex-end;*/
    justify-content: space-between;
    /*right: 5px;*/
    right: 0px;
    bottom: 25px;
    height: 32px;
}
.item_wrap .item_icon li {
    width: 32px;
    margin-left: 3px;
    cursor: pointer;
}
.item_wrap .item_icon li.item_fav_wrap{
    /*border: 1px solid #c8c8c8;
    border-radius: 50%;
    width: 30px;
    margin: 1px 0 1px 2px;*/
}
.item_wrap .item_icon li button {
    width: 32px;
    padding: 0;
    border: none;
    background: transparent;
}
.item_wrap .item_icon li button img {
    display: block;
}
.item_wrap .item_icon li:hover {
    opacity: 0.7;
}

.item_wrap .file_type {
    background-color: #EB5591;
    color: #FFF;
    padding: 1px 3px;
    border-radius: 2px;

}

/****** pager ******/
#pager {
    margin-top: 50px;
}
#pager ul {
    display: flex;
    justify-content: center;
	flex-wrap : wrap;
}
#pager ul li a {
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    border: 1px solid #000;
    font-size: 14px;
    text-align: center;
    line-height: 38px;
    cursor: pointer;
    color: #000;
}
#pager ul li.active a {
    background: #0098AA;
    border: 1px solid #0098AA;
    color: #FFF;
}
#pager ul li {
	margin-bottom: 10px;
}
#pager ul li:not(:last-child) {
    margin-right: 10px;
}
#pager ul li a:hover {
    background: #0098AA;
    border: 1px solid #0098AA;
    color: #FFF;
    text-decoration: none;
}

/****** header ******/
header .header_content {
    /*padding: 15px 0;*/
    padding: 20px 0 18px 0;
    /*background-image: url("../../img/common/header_bg.png");*/
    background-repeat: no-repeat;
    background-position: right;
    background-size: 100% auto;
}
header .header_content .inner,
header .header_content .inner ul.header_icon_wrap {
    display: flex;
    justify-content: space-between;
}
header .header_content .inner .header_logo {
    display: flex;
    align-items: center;
    width: 180px;
    /*margin-right: 10px;
    margin-right: 25px;*/
    margin:0 15px 0 19px;
}
header .header_content .inner .header_logo a img{
	width:100%;
}
header .header_search_wrap {
    display: flex;
    align-items: center;
    /*width: 510px;*/
    width: 485px;
    /*margin-right: 30px;*/
    margin-right: 20px;
}
header .input_search {
    width: 100%;
    padding: 12px 20px;
    border: 1px solid #AAA;
    border-radius: 40px;
    background: #FFF;
}
header .header_content .inner form span {
    display: block;
    margin-bottom: 5px;
    font-size: 12px;
}
header .header_content .inner form .header_search_form {
    position: relative;
    width: 400px;
    margin-left: 10px;
}
header .header_content .inner form .header_search_form input[type="submit"] {
    position: absolute;
    top: 8px;
    right: 15px;
    width: 25px;
    height: 25px;
    background-image:url("../../img/common/icon/icon_input_search.svg");
    background-size: cover;
}
header .header_content .inner form .header_search_form input[type="submit"]:hover {
    opacity: 0.7;
}
header input.loader {
    background-image:url("../../img/common/loading.gif") !important;
}
header .header_content .inner form a {
    display: block;
    width: 100px;
    padding: 11px 0;
    border: 1px solid #AAA;
    border-radius: 40px;
    background: #FFF;
    font-size: 14px;
    text-align: center;
    text-decoration: none;
	color: #36a7c7;
}
header .header_content .inner form a:hover {
    opacity: 0.7;
}
header .header_content .inner ul li {
    position: relative;
    width: 55px;
    line-height: .8em;
    text-align: center;
}
header .header_content .inner ul li a {
    font-size: 10px;
    color: #000;
}
header .header_content .inner ul li a:hover {
    color: #EB5591;
}
header .header_content .inner ul li a .header_icon_name {
    display: block;
    /*transform: scale(0.7);*/
}
header .header_content .inner ul li a.header_icon::before {
    content: '';
    display: block;
    width: 40px;
    height: 40px;
    margin: 0 auto 5px;
    border-radius: 20px;
    background-size: cover;
}
header .header_content .inner ul li a.icon_mypage::before { background-image: url("../../img/common/icon/icon_btn_mypage.svg"); }
header .header_content .inner ul li a.icon_cart::before { background-image: url("../../img/common/icon/icon_btn_cart.svg"); }
header .header_content .inner ul li a.icon_flow::before { background-image: url("../../img/common/icon/icon_btn_flow.svg"); }
header .header_content .inner ul li a.icon_redownload::before { background-image: url("../../img/common/icon/icon_btn_redownload_2.svg"); }
header .header_content .inner ul li a.icon_logout::before { background-image: url("../../img/common/icon/icon_btn_logout.svg"); }
header .header_content .inner ul li a.icon_mypage:hover::before { background-image: url("../../img/common/icon/icon_btn_mypage_active.svg"); }
header .header_content .inner ul li a.icon_cart:hover::before { background-image: url("../../img/common/icon/icon_btn_cart_active.svg"); }
header .header_content .inner ul li a.icon_flow:hover::before { background-image: url("../../img/common/icon/icon_btn_flow_active.svg"); }
header .header_content .inner ul li a.icon_redownload:hover::before { background-image: url("../../img/common/icon/icon_btn_redownload_active.svg"); }
header .header_content .inner ul li a.icon_logout:hover::before { background-image: url("../../img/common/icon/icon_btn_logout_active.svg"); }
header .header_content .inner ul li a .icon_cart_cnt {
    position: absolute;
    top: 0;
    right: 5px;
    width: 15px;
    height: 15px;
    border-radius: 8px;
    background: #EB5591;
    font-size: 10px;
    line-height: 1.5em;
    font-weight: bold;
    color: #FFF;
    text-align: center;
}
header .header_nav_wrap {
    position: relative;
    height: 56px;
    background: #33ACBB;
}
header .header_nav_wrap .inner ul {
    display: flex;
}
header .header_nav_wrap .inner ul .header_nav {
    width: 20%;
    border-right: 1px solid #FFF;
}
header .header_nav_wrap .inner ul .header_nav:first-child {
    border-left: 1px solid #FFF;
}
header .header_nav_wrap .inner ul .header_nav a {
    display: block;
    padding-bottom: 6px;
    text-align: center;
    font-size: 12px;
    font-weight: bold;
    color: #FFF;
    text-decoration: none;
}
header .header_nav_wrap .inner ul .header_nav:hover {
    background: #0098AA;
}
header .header_nav_wrap .inner ul .header_nav a img {
    display: block;
    width: 40px;
    margin: -10px auto 3px;
}
header.header_shopping .header_content {
    padding: 10px 0;
    border-bottom: 1px solid #0098aa;
}
header.header_shopping .header_content .inner h1 {
    width: 100px;
}

/****** header_nav_dropdwn ******/
header .header_nav_wrap .header_nav_dropdwn {
    display: none;
    position: absolute;
    top: 56px;
    left: 0;
    z-index: 999;
    width: 100%;
    padding-top: 25px;
    background: #F6F5F1;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1); 
}
@media all and (-ms-high-contrast: none) {
    /* IE用 */
    header .header_nav_wrap .header_nav_dropdwn {
        top: 52px;
    }
}
header .header_nav_wrap .header_nav_sub h2 {
    position: relative;
    display: block;
    margin-bottom: 25px;
    padding:  0 0 20px 25px;
    border-bottom: 1px solid  #CCC;
    font-size: 20px;
    font-weight: bold;
    line-height: 1em;
}
header .header_nav_wrap .header_nav_sub h2::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
}
header .header_nav_wrap .header_nav_sub .header_nav_sub_title {
    position: relative;
    display: block;
    margin-bottom: 25px;
    padding:  0 0 20px 25px;
    border-bottom: 1px solid  #CCC;
    font-size: 20px;
    font-weight: bold;
    line-height: 1em;
}
header .header_nav_wrap .header_nav_sub .header_nav_sub_title::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
}
/****** header_nav_sub01 ******/
header .header_nav_sub.header_nav_sub01 h2::before {
    background-image: url("../../img/common/icon/icon_gakki.svg");
}
header .header_nav_sub.header_nav_sub01 .header_nav_sub_title::before {
    background-image: url("../../img/common/icon/icon_gakki.svg");
}
header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
header .header_nav_sub.header_nav_sub01 {
    padding-bottom: 25px;
}
header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner div {
    width: 32%;
    margin-bottom: 20px;
}
header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner div p {
    display: inline-block;
    margin-bottom: 10px;
}
header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner div p a {
    font-size: 16px;
    font-weight: bold;
    text-align: left;
    text-decoration: underline;
}
header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner div p.header_nav_sub_title01 a { 
    color: #4DB4DE; 
}
header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner div p.header_nav_sub_title02 a { 
    color: #C98F46;
}
header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner div p.header_nav_sub_title03 a { 
    color: #F273CA;
}
header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner div p.header_nav_sub_title04 a { 
    color: #AC64A1;
}
header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner div p.header_nav_sub_title05 a { 
    color: #F19E67;
}
header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner div p.header_nav_sub_title06 a { 
    color: #EED452;
}
header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner ul,
header .header_nav_sub.header_nav_sub02 .header_nav_sub_inner ul,
header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul {
    flex-wrap: wrap;
}
header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner ul li a,
header .header_nav_sub.header_nav_sub02 .header_nav_sub_inner ul li a {
    display: flex;
    align-items: center;
    height: 25px;
    margin: 0 5px 5px 0;
    padding: 0 15px;
    background: #FFF;
    border: 1px solid #CCC;
    border-radius: 20px;
    font-size: 12px;
    color: #000;
    font-weight: normal;
    line-height: 1em;
}
header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner ul li a:hover,
header .header_nav_sub.header_nav_sub02 .header_nav_sub_inner ul li a:hover {
    border: 1px solid #EB5591;
    color: #EB5591;
}

/****** header_nav_sub02 ******/
header .header_nav_sub.header_nav_sub02 h2::before {
    background-image: url("../../img/common/icon/icon_genre.svg");
}
header .header_nav_sub.header_nav_sub02 .header_nav_sub_title::before {
    background-image: url("../../img/common/icon/icon_genre.svg");
}
header .header_nav_sub.header_nav_sub02 .header_nav_sub_inner {
    padding-bottom: 45px;
}
header .header_nav_sub.header_nav_sub02 .header_nav_sub_inner .btn_s {
    margin-top: 15px;
    padding-bottom: 12px !important;
    width: 180px;
    color: #000;
    font-weight: normal;
    line-height: 1em;
}
header .header_nav_sub.header_nav_sub02 .header_nav_sub_inner .btn_s:hover {
    opacity: 0.7;
}

/****** header_nav_sub03 ******/
header .header_nav_sub.header_nav_sub03 h2::before {
    background-image: url("../../img/common/icon/icon_question.svg");
}
header .header_nav_sub.header_nav_sub03 .header_nav_sub_title::before {
    background-image: url("../../img/common/icon/icon_question.svg");
}
header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner {
    padding-bottom: 30px;
}
header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li {
    width: 33%;
    margin-bottom: 15px;
}
header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li a {
    position: relative;
    display: inline-block;
    padding-left: 30px;
    color: #000;
    font-size: 14px;
    font-weight: normal;
    text-align: left;
}
header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li a:hover {
    color: #EB5591;
    text-decoration: underline;
}
header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li a::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0;
    width: 19px;
    height: 19px;
}
header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(1) a::before { background-image: url("../../img/common/icon/icon_flow.svg"); }
header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(2) a::before { background-image: url("../../img/common/icon/icon_note.svg"); }
header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(3) a::before { background-image: url("../../img/common/icon/icon_check.svg"); }
header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(4) a::before { background-image: url("../../img/common/icon/icon_necessary.svg"); }
header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(5) a::before { background-image: url("../../img/common/icon/icon_question.svg"); }
header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(6) a::before { background-image: url("../../img/common/icon/icon_school.svg"); }
header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(7) a::before { background-image: url("../../img/common/icon/icon_payment.svg"); }
header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(8) a::before { background-image: url("../../img/common/icon/icon_redownload.svg"); }
header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(9) a::before { background-image: url("../../img/common/icon/icon_contact.svg"); }

/****** footer ******/
footer {
    margin-top: 100px;
    border-top: 1px solid #CCC;
}
footer .footer_content .inner {
    display: flex;
    justify-content: space-between;
    padding: 40px 0;
}
footer .footer_content .inner img {
    display: block;
}
footer .footer_content .inner dl:not(:last-child) {
    /*margin-right: 25px;*/
    /*margin-right: 15px;*/
}
footer .footer_content .inner dl dt {
    margin-bottom: 10px;
    font-size: 14px;
}
footer .footer_content .inner dl dd span {
    display: block;
    margin-top: 10px;
    font-size: 10px;
    line-height: 1.5em;
}
footer .footer_content .inner dl dd ul  {
    display: flex;
}
footer .footer_content .inner dl dd ul li {
    /*width: 100px;*/
    max-width: 100px;
    line-height: 1em;
}
footer .footer_content .inner dl dd ul li:not(:last-child) {
    margin-right: 15px;
}
footer .footer_content .inner dl dd ul li:not(:last-child) img{
    width: 85px;
}
footer .footer_nav {
    padding: 40px 0;
    background: #EFEDE9;
}
footer .footer_nav .inner {
    display: flex;
}
footer .footer_nav .inner .footer_nav_wrap {
    margin-right: 40px;
    padding-right: 40px;
    border-right: 1px solid #CCC;
}
footer .footer_nav .inner .footer_nav_about a {
    text-decoration: underline;
}
footer .footer_nav .inner .footer_nav_wrap p,
footer .footer_nav .inner .footer_nav_about p:first-child {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
}
footer .footer_nav .inner ul li a,
footer .footer_nav .inner .footer_nav_about_text li{
    font-size: 12px;
    color: #333;
    line-height: 2em;
}
footer .footer_nav .inner .footer_nav_about_text li a.footer_icon{
    text-decoration: none;
}
footer .footer_nav .inner .footer_nav_about_text li a.footer_icon::before{
    display: inline-block;
    /*font-family: "FontAwesome";*/
    font-size: 24px;
    font-weight:400;
    margin-right: 10px;
    padding:10px 0;
}
footer .footer_nav .inner .footer_nav_about_text li a.footer_icon.footer_icon_twitter::before{
    /*content: '\f099';*/
    content: '𝕏';
}
footer .footer_nav .inner .footer_nav_about_text li a.footer_icon.footer_icon_youtube::before{
    /*content: '\f167';*/
    content: '📺';
}
footer .footer_nav .inner .footer_nav_about_text li a.footer_icon.footer_icon_smile::before{
    /*content: '\f4da';*/
    content: '📰';
}

footer .footer_nav .inner ul li a:hover {
    color: #EB5591;
}
footer .footer_nav_sub {
    padding: 40px 0;
    background: #5C5C5C;
    color: #FFF;
}
footer .footer_nav_sub .inner ul {
    margin-bottom: 40px;
    text-align: center;
}
footer .footer_nav_sub .inner ul li {
    display: inline-block;
}
footer .footer_nav_sub .inner ul li:not(:last-child) {
    margin-right: 15px;
    padding-right: 15px;
    border-right: 1px solid #FFF;
}
footer .footer_nav_sub .inner ul li a {
    font-size: 12px;
    color: #FFF;
}
footer .footer_nav_sub .inner p {
    font-size: 10px;
    line-height: 1.8em;
    text-align: center;
}

/****** view_select ******/
.view_select {
    /*margin-bottom: 25px;*/
	margin-bottom: 20px;
    text-align: right;
    /*font-size: 12px;*/
	/*font-size: 14px;*/
    color: #666;
}
.view_select a {
    cursor: pointer;
	color:#36a7c7;
}
.view_select a i{
    font-size:20px;
    vertical-align: middle;
}
.view_select a span{
    text-decoration: underline;
}
/*
.view_select .active {
	color: #999;
    text-decoration: none;
}*/





/*  mobile & smart phone
---------------------------------------------- */
@media only screen and (max-width: 959px) {	

    /****** common ******/
    .inner {
        width: 96%;
    }
    #clm_2 {
        display: block;
    }
    main {
        width: 96%;
        /*margin: 150px auto 0;*/
        margin: 15px auto 0;
    }

    /****** pagetop ******/
    #product_detail .pagetop_link {
        /*bottom: 120px;*/
        bottom: 138px;
    }
    #cart .pagetop_link {
        bottom: 100px;
    }
    #shopping_download .pagetop_link,
    #shopping_download_confirm .pagetop_link{
        /*bottom: 120px;*/
        bottom: 190px;
    }
    #shopping_convenience .pagetop_link {
        bottom: 150px;
    }

    
    
    /****** autocomplete base ******/
    .ui-autocomplete {
        top: 34px !important;
    }
    
    /****** pankuzu base ******/
    #pankuzu {
    padding-bottom: 10px;
    }

    /****** page_title ******/
    #page_title .pagelink li {
        width: 48%;
    }
    #page_title .pagelink li:nth-child(-n + 4) {
        margin-bottom: 10px;
    }
    #page_title .pagelink li a {
        padding: 10px 0 10px 20px;
        text-align: left;
        font-size: 12px;
    }

    /****** subtitle base ******/
    .subtitle {
	display: block;
    }
    .subtitle div {
        /*display: flex;*/
	display: block;
    }
    .subtitle h2 {
        font-size: 18px;
	white-space:nowrap;
    }
    .subtitle h2::before {
        top: -1px;
    }
    .subtitle span {
        font-size: 10px;
    }
    .subtitle a {
        font-size: 10px;
    }
    #product_detail .line_blue::after {
        content: '';
    }
    
    
    /****** topic_list base ******/
    .topic_list li span {
        display: block;
        margin: 5px 0 0 0;
    }
    .topic_list li .icon_new {
        padding-left: 20px;
    }
    .topic_list li .icon_new::before {
        left: 0px;
    }
    
    /****** modal base ******/
    .modal .modal_inner {
        top: 45%;
        width: 90%;
        max-height: 70vh;
    }
    .modal .modal_inner .btn {
        width: 100%;
    }
    .modal.modal_content_sample .modal_inner {
        top: 45%;
        width: 90%;
        /*max-height: 70vh;*/
        max-height: 72vh;
        padding:15px;
        overflow-y:auto;
    }
    .modal.modal_content_sample .modal_inner::-webkit-scrollbar {
        width: 10px;
    }
    .modal.modal_content_sample .modal_inner::-webkit-scrollbar-thumb{
        background: #999;
        border-radius: 5px;
    }
    .modal.modal_content_sample .modal_inner::-webkit-scrollbar-track-piece {
        background: #efefef;
    }

    .modal.modal_content_sample .modal_inner.to_detail{
        top: 83% !important;
    }
    

    /****** item base ******/
    .item_wrap2 .item {
        flex-wrap: wrap;
    }
    .item_wrap2 .item_gakki {
        width: 30px;
        font-size: 26px;
        margin: -5px 5px 0 0;
    }
    .item_wrap2 .item_info {
        /*width: calc(100% - 50px) !important;*/
        width: calc(100% - 45px) !important;
        margin-bottom: 5px;
    }
    .item_wrap2 .item_price {
        width: 100%;
        /*margin-left: 35px;
        margin-left: 28px;*/
        margin-right:15px;
    }
    .item_wrap .item .item_info .item_title_artist_wrapper{
        min-height:auto;
    }
    
    /*.item_wrap .item_info h3 {
        font-size: 16px;
    }*/

    .item_info h3,
    .item_info .item_artist,
    .item_info .item_text {
        white-space: normal;
    }
    #product_detail .item_wrap .item_info h1 {
        /*font-size: 16px;*/
	font-size: 20px;
    }
    .item_wrap .item_price p {
        font-size: 16px;
        margin-left: 10px;
        padding-left: 18px;
    }
    .item_wrap .item_price p::before {
        top: 4px;
        width: 17px;
        height: 17px;
    }
    .item_wrap .item_price p.icon_download::before { background-image: url("../../img/common/icon/icon_download_gray.svg"); }
    .item_wrap .item_price p.icon_convenience::before { background-image: url("../../img/common/icon/icon_convenience_gray.svg"); }
    .item_wrap .item_icon {
        position: relative;
        /*margin-top: 10px;*/
        margin-top: 8px;
        /*margin-left: 45px;
        margin-left: 32px;*/
        margin-right: 15px;
        bottom: 0;
        height: 30px;
        justify-content: flex-end;
        width: 100%;
    }
    .item_wrap .item_price {
        /*justify-content: flex-start;*/
        justify-content: flex-end;
        width:100%;
    }
    .item_wrap .item_icon li {
        width: 30px;
    }
    .item_wrap .item_icon li.item_fav_wrap {
        /*width: 28px;*/
    }
    .item_wrap ul.item_icon li.item_fav_wrap .item_fav {
        /*margin-top: 5.5px;*/
    }
    .item_wrap ul.item_icon li.item_fav_wrap .item_fav::before {
        /*margin-left: 6.5px;*/
        margin:2px 0 0 8px;
    }
    
    .item_wrap .item_icon li button {
        width: 30px;
    }
    #homepage #ranking .item_wrap .item,
    #gakki_top #ranking .item_wrap .item {
        flex-wrap: wrap;
    }
    #homepage #ranking .item_wrap .item .ranking_icon,
    #gakki_top #ranking .item_wrap .item .ranking_icon {
        width: 21px;
    }
    #homepage #ranking .item_wrap .item .item_info,
    #gakki_top #ranking .item_wrap .item .item_info {
        width: calc(100% - 40px);
    }
    #homepage #ranking .item_wrap .item .item_price,
    #gakki_top #ranking .item_wrap .item .item_price {
        margin-top: 5px;
        /*margin-left: 26px;*/
        margin-right:15px;
    }
    #homepage #ranking .item_wrap .item .item_icon,
    #gakki_top #ranking .item_wrap .item .item_icon {
        /*width: calc(100% - 26px);*/
        width:100%;
        justify-content: flex-end;
        /*margin-left: 38px;*/
        margin-right:15px;
    }
    #homepage #new .item_wrap .item,
    #gakki_top #new .item_wrap .item {
        display: block;
    }
    #homepage #new .item_wrap .item .item_info,
    #gakki_top #new .item_wrap .item .item_info {
        width: 100%;
    }
    #homepage #new .item_wrap .item .item_price,
    #gakki_top #new .item_wrap .item .item_price {
        margin-top: 5px;
        padding-right:15px;
    }
    #homepage #new .item_wrap .item .icon_download,
    #gakki_top #new .item_wrap .item .icon_download {
        margin-left: -2px;
    }
    #homepage #new .item_wrap .item .item_icon,
    #gakki_top #new .item_wrap .item .item_icon {
        margin-left: 0;
        justify-content: flex-end;
        padding-right:15px;
    }
    

    /****** header ******/
    header {
        /*position: fixed;
        top: 0;
        left: 0;
        width: 100%;*/
        background: #FFF;
        z-index: 999;
    }
    header .header_sp_content {
        position: relative;
        height: 70px;
    }
    header .header_sp_content .inner > span {
        font-size: 10px;
    }
    header .header_sp_content {
        background-size: cover;
        background-position: right;
    }
    header .header_sp_content .header_sp_logo {
        width: 120px;
    }
    header .header_sp_content .header_sp_icon_wrap {
        display: flex;
        position: absolute;
        bottom: 5px;
        right: 80px;
    }
    header .header_sp_content .header_sp_icon_wrap .header_sp_icon {
        position: relative;
        display: block;
        width: 35px;
        height: 35px;
        margin-left: 5px;
        border-radius: 18px;
    }
    header .header_sp_content .header_sp_icon_wrap .header_sp_icon.icon_mypage {
        background-image: url("../../img/common/icon/icon_btn_mypage.svg");
    }
    header .header_sp_content .header_sp_icon_wrap .header_sp_icon.icon_cart {
        background-image: url("../../img/common/icon/icon_btn_cart.svg");
    }
    header .header_sp_content .header_sp_icon_wrap .header_sp_icon.icon_redownload {
        background-image: url("../../img/common/icon/icon_btn_redownload_2.svg");
    }
    header .header_sp_content .header_sp_icon_wrap .header_sp_icon .icon_cart_cnt {
        position: absolute;
        top: -2px;
        right: -2px;
        width: 15px;
        height: 15px;
        border-radius: 8px;
        background: #EB5591;
        font-size: 10px;
        line-height: 1.5em;
        font-weight: bold;
        color: #FFF;
        text-align: center;
    }
    header .header_sp_content .header_sp_nav_open {
        position: absolute;
        top: 0;
        right: 0;
        width: 70px;
        height: 70px;
        background: #0098AA;
    }
    header .header_sp_content .header_sp_nav_open span {
        position: relative;
        display: block;
        width: 40px;
        height: 3px;
        margin: 0 auto;
        background: #FFF;
    }
    header .header_sp_content .header_sp_nav_open span::before,
    header .header_sp_content .header_sp_nav_open span::after {
        content: '';
        display: block;
        position: absolute;
        width: 40px;
        height: 3px;
        background: #FFF;
        left: 0;
        top: -12px;
        transition: 0.5s;
    }
    header .header_sp_content .header_sp_nav_open span::after {
        top: 12px;
    }
    
    header .header_sp_content .header_sp_nav_open.active span {
        background: #0098aa;
    }
    header .header_sp_content .header_sp_nav_open.active span::before,
    header .header_sp_content .header_sp_nav_open.active span::after {
        width: 40px;
        height: 3px;
        transform: translateY(12px) rotate(-45deg);
    }
    header .header_sp_content .header_sp_nav_open.active span::after {
        transform: translateY(-12px) rotate(45deg);
    }
    
    header .header_sp_search {
        display: flex;
        align-items: center;
        background: #F3F1EC;
        height: 52px;
        box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1); 
    }
    header .header_sp_search .inner form div {
        position: relative;
    }
    header .header_sp_search .inner form div input[type="submit"] {
        position: absolute;
        top: 7px;
        right: 12px;
        width: 20px;
        height: 20px;
        background-image:url("../../img/common/icon/icon_input_search.svg");
        background-size: cover;
    }
    header .header_sp_search .inner .input_search {
        padding: 8px 15px;
        font-size: 16px;
    }
    header.header_shopping .header_sp_content {
        height: auto;
        padding: 10px 0;
        border-bottom: 1px solid #0098aa;
    }
    
    /****** header_sp_nav_wrap ******/
    header .header_sp_nav_wrap {
        display: none;
        position: fixed;
        left: 0;
        bottom: 0;
        z-index: 9999;
        width: 100%;
        height: calc(100% - 122px);
        background: #33ACBB;
        overflow-y: scroll;
    }
    header .header_sp_nav_wrap .inner {
        width: 100%;
    }
    header .header_sp_nav_wrap .inner ul {
        display: block;
        padding-top: 10px;
    }
    header .header_sp_nav_wrap .inner ul .header_nav {
        border-bottom: 1px solid #FFF;
    }
    header .header_sp_nav_wrap .inner ul .header_nav a {
        display: block;
        position: relative;
        width: 100%;
        padding: 10px;
        font-size: 14px;
        font-weight: bold;
        color: #FFF;
        line-height: 30px;
        text-decoration: none;
    }
    header .header_sp_nav_wrap .inner ul .header_nav a img {
        display: inline-block;
        width: 30px;
        margin-right: 5px;
    }
    header .header_sp_nav_wrap .header_nav_sub h2 {
        position: relative;
        display: block;
        margin-bottom: 25px;
        padding:  0 0 20px 25px;
        border-bottom: 1px solid  #CCC;
        font-size: 20px;
        font-weight: bold;
        line-height: 1em;
    }
    header .header_sp_nav_wrap .header_nav_sub h2::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 20px;
        height: 20px;
    }
    header .header_sp_nav_wrap .header_sp_subnav_open::after {
        /*content: '\f13a';*/
        content: '▼';
        position: absolute;
        right: 10px;
        /*font-family: FontAwesome;*/
    }
    header .header_sp_nav_wrap .header_nav_sub {
        display: none;
        background: #FFF;
    }
    header .header_nav_sub .header_nav_sub_inner {
        padding: 20px;
    }
    
    /****** header_nav_sub01 ******/
    header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner {
        display: block;
    }
    header .header_nav_sub.header_nav_sub01 {
        padding-bottom: 0;
    }
    header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner div {
        width: 100%;
    }
    header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner div p {
        margin-bottom: 0;
    }
    header .header_nav_sub.header_nav_sub01 .header_nav_sub_inner ul li a,
    header .header_nav_sub.header_nav_sub02 .header_nav_sub_inner ul li a {
        text-align: center;
    }

    /****** header_nav_sub02 ******/
    header .header_nav_sub.header_nav_sub02 .header_nav_sub_inner {
        padding-bottom: 30px;
    }

    /****** header_nav_sub03 ******/
    header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner {
        padding-bottom: 20px;
    }
    header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul {
        display: block;
        padding-top: 0;
    }
    header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li {
        width: 100%;
        margin: 0;
    }
    header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:not(:last-child) {
        border-bottom: 1px solid #CCC;
    }
    header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li a::before {
        top: 15px;
    }

    header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(1) a::before { background-image: url("../../img/common/icon/icon_flow.svg"); }
    header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(2) a::before { background-image: url("../../img/common/icon/icon_necessary.svg"); }
    header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(3) a::before { background-image: url("../../img/common/icon/icon_payment.svg"); }
    header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(4) a::before { background-image: url("../../img/common/icon/icon_experience.svg"); }
    header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(5) a::before { background-image: url("../../img/common/icon/icon_note.svg"); }
    header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(6) a::before { background-image: url("../../img/common/icon/icon_question.svg"); }
    header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(7) a::before { background-image: url("../../img/common/icon/icon_check.svg"); }
    header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(8) a::before { background-image: url("../../img/common/icon/icon_school.svg"); }
    header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(9) a::before { background-image: url("../../img/common/icon/icon_redownload.svg"); }
    header .header_nav_sub.header_nav_sub03 .header_nav_sub_inner ul li:nth-child(10) a::before { background-image: url("../../img/common/icon/icon_contact.svg"); }


    /****** footer ******/
    footer .footer_content .inner {
        display: block;
        padding: 20px 0;
    }
    footer .footer_content .inner img {
        display: block;
    }
    footer .footer_content .inner dl:not(:last-child) {
        margin: 0 0 20px 0;
        padding-bottom: 20px;
        border-bottom: 1px solid #CCC;
    }
    footer .footer_content .inner dl dt {
        font-size: 12px;
    }
    footer .footer_content .inner dl dd ul li {
        /*width: 80px;*/
    }
    footer .footer_content .inner dl dd ul li:not(:last-child) {
        margin-right: 15px;
    }
    footer .footer_content .inner dl dd ul li:not(:last-child) img {
        /*width: auto;*/
        max-width:80px;
    }
    footer .footer_content .inner dl dd ul li span {
        /*font-size: 8px;*/
    }
    footer .footer_nav {
        padding: 20px 0;
    }
    footer .footer_nav .inner {
        display: block;
    }
    footer .footer_nav .inner .footer_nav_wrap p,
    footer .footer_nav .inner .footer_nav_about p {
        position: relative;
        margin-bottom: 10px;
        padding-bottom: 10px;
        border-bottom: 1px solid #CCC;
    }

    footer .footer_nav .inner .footer_nav_wrap p::after,
    footer .footer_nav .inner .footer_nav_about p::after {
        /*content: '\f13a';*/
        content: '▼';
        position: absolute;
        top: 3px;
        right: 10px;
        /*font-family: FontAwesome;*/
    }
    footer .footer_nav .inner .footer_nav_wrap {
        margin-right: 0;
        padding-right: 0;
        border-right: none;
    }
    footer .footer_nav .footer_nav_acd + ul {
        display: none;
        padding-bottom: 20px;
    }
    footer .footer_nav_sub {
        padding: 20px 0;
    }
    footer .footer_nav_sub .inner ul {
        margin-bottom: 20px;
        text-align: left;
    }
    footer .footer_nav_sub .inner ul li {
        display: block;
    }
    footer .footer_nav_sub .inner ul li:not(:last-child) {
        margin: 0 0 10px 0;
        padding: 0 0 10px 0;
        border-right: none;
        border-bottom: 1px solid #AAA;
    }
    footer .footer_nav_sub .inner p {
        text-align: left;
    }
    
}