@charset "utf-8";
.sp {
    display: block;
}

.pc {
    display: none;
}

img {
    max-width: 100%;
}

.menu-trigger,
.menu-trigger span {
    display: inline-block;
    transition: all .4s;
    box-sizing: border-box;
}

.menu-trigger {
    position: fixed;
    top: 23px;
    right: 3%;
    width: 34px;
    height: 16px;
    z-index: 2;
}

.menu-trigger span {
    position: absolute;
    left: 0;
    width: 28px;
    height: 2px;
    background-color: #999;
    border-radius: 4px;
}

.menu-trigger span:nth-of-type(1) {
    top: 0;
}

.menu-trigger span:nth-of-type(2) {
    top: 7px;
}

.menu-trigger span:nth-of-type(3) {
    bottom: 0;
}

.menu-trigger.active span:nth-of-type(1) {
    -webkit-transform: translateY(2.3vw) rotate(-45deg);
    transform: translateY(4px) rotate(-45deg);
}

.menu-trigger.active span:nth-of-type(2) {
    opacity: 0;
}

.menu-trigger.active span:nth-of-type(3) {
    -webkit-transform: translateY(-2.3vw) rotate(45deg);
    transform: translateY(-10px) rotate(45deg);
}

.menu-trigger+ul {
    display: none;
}

.menu-trigger.active+ul {
    overflow: hidden;
    display: block !important;
}

body {
    padding: 65px 0 0;
}

#header {
    padding: 15px 0 0;
    position: fixed;
    top: 0;
    left: 0;
    background: #fff;
    z-index: 99999;
    width: 100%;
}

#header:after {
    margin: 15px 0 0;
}

#header h1 img {
    height: 35px;
    padding: 0 3vw 0 3vw;
    box-sizing: border-box;
}

#header h1 {
    float: none;
}

#header nav {
    position: fixed;
    float: none;
    width: 100%;
    top: 69px;
    padding: 0;
}

#header nav ul li {
    display: block;
    border: 0px none;
    border-bottom: 1px solid #fe5343;
}

#header nav ul li a {
    background: #fff;
    padding: 20px 15px;
    font-size: 16px;
}

#header nav ul li a:hover {
    opacity: 1;
    background: #f1f1f1;
}

#content {
    padding: 0 3%;
}

section .update_list ul li {
    overflow: hidden;
    float: none;
    width: 100%;
    margin: 0 0 2% 0;
    display: block;
    padding: 3%;
    border-radius: 3vw;
}

section .update_list ul li figure {
    float: left;
    width: 27%;
}

section .update_list ul li figure img {
    width: 100%;
}

section .update_list ul li p {
    float: right;
    width: 70%;
    font-size: 3.4vw;
    line-height: 1.6em;
    height: 22.5vw;
    overflow: hidden;
}

section .update_list ul li .btns {
    width: 100%;
    clear: both;
    padding: 3% 0 0;
}

section .update_list ul li .btns a {
    font-size: 3.4vw;
    padding: 3%;
    display: inline-block;
    width: 43%;
    margin: 0;
}

section .update_list ul li .btns a:last-child {
    margin: 0;
}

section h2 {
    font-size: 4.5vw;
    padding: 2% 0;
    margin: 5% 0 0;
    border-radius: 1.5vw;
}

section h2:before {
    margin-left: -4vw;
    top: -5.5vw;
    width: 8vw;
    height: 5vw;
    background-size: 100%;
}

#content>section {
    margin: 10% 0;
}

.slick-dots {
    bottom: -6vw;
}

.slick-dots li button {
    width: 2vw;
    height: 2vw;
    padding: 1vw;
}

.slick-dots li {
    width: 2vw;
    height: 2vw;
    margin: 0 2vw;
}

.slick-dotted.slick-slider {
    margin-bottom: 12vw;
}

section .update_list h3 {
    font-size: 4vw;
    padding: 3% 0;
}

section .update_list h3:before {
    width: 8vw;
    height: 5vw;
    background-size: 100%;
}

section .feature_list ul {
    margin: 5% 0 0;
}

section .update_list {
    margin: 5% 0;
    padding: 3%;
    border-radius: 5vw;
}

section .feature_list ul li {
    overflow: hidden;
    width: 32%;
    margin: 0 2% 7% 0;
}

section .feature_list ul li:nth-child(4n) {
    margin: 0 2% 2% 0;
}

section .feature_list ul li:nth-child(3n) {
    margin-right: 0;
}

section .feature_list ul li img {
    width: 100%;
}

section .feature_list ul li p strong {
    font-size: 3.2vw;
    margin: 4% 0 2%;
    line-height: 1.4em;
}

section .feature_list ul li p span {
    font-size: 2.6vw;
    line-height: 1.4em;
}

#footer .f_bnr:before {
    margin: 0 0 5%;
}

#footer .f_bnr:after {
    margin: 5% 0 0;
}

#footer .f_bnr li {
    display: inline-block;
    width: 45vw;
    margin: 0 1.2vw;
}

#footer .f_bnr li:nth-of-type(1),
#footer .f_bnr li:nth-of-type(2) {
    margin-bottom: 3vw;
}

#footer .inner {
    padding: 5% 0;
}

#footer .f_logo {
    margin: 0 0 5%;
}

#footer .f_logo img {
    height: 15vw;
}

#footer .f_menu li {
    padding: 0 3%;
}

#footer .f_menu li a {
    font-size: 3vw;
}

#footer .copy {
    font-size: 3vw;
    margin: 3% 0 5%;
}

#footer .f_sns li {
    margin: 0 1%;
}

#footer .f_sns li img {
    height: 9vw;
}

#header h1 span {
    display: none;
}

body.teaser #content {
    padding: 0;
}

.terms_fv {
    margin: 0;
}

body.terms section p.explain {
    font-size: 3.4vw;
    margin: 5% 0;
}

body.terms section p.explain span {
    font-size: 3vw;
}

body.terms section section {
    margin: 5% 0;
    padding: 3%;
}

body.terms section section h3 {
    font-size: 4vw;
    padding: 3% 0;
    margin: 0 0 1%;
}

body.terms section section h3:before {
    width: 8vw;
    height: 5vw;
    background-size: 100%;
}

body.terms section section p {
    font-size: 3.4vw;
}

body.terms section section .address_here {
    margin: 8% 0;
    font-size: 4vw;
}

body.terms section section .txt_box {
    margin: 5% 0 0;
    padding: 5%;
}

body.terms section section .txt_box h4 {
    font-size: 4vw;
    margin: 0 0 5%;
}

body.terms section section .txt_box ul li {
    margin: 3% 0 0;
    font-size: 3.4vw;
}

body.terms section section .txt_box ul li span {
    font-size: 3vw;
}

body.terms section section iframe {
    margin: 5% 0 0;
    height: 50vw;
}

.notice {
    padding: 3% 0 0;
    font-size: 3.4vw;
}

.notice:after {
    margin: 1.5% 0 0;
}

.notice p:before {
    width: 8vw;
    height: 5vw;
    background-size: 100%;
}

.detail_fv {
    margin: 0 0 5%;
}

.detail_info dl {
    float: none;
    width: 100%;
}

.detail_info ul {
    float: none;
    width: 100%;
}

.detail_info dl dt {
    font-size: 5vw;
    margin: 0 0 3%;
}

.detail_info dl dd {
    margin: 0 0 3%;
    font-size: 4vw;
}

.detail_info dl dd.original_ttl {
    margin: 3% 0;
    font-size: 3.4vw;
}

.detail_info ul {
    overflow: hidden;
}

.detail_info ul li {
    float: left;
    width: 48.5%;
    margin: 0;
}

.detail_info ul li:nth-of-type(2) {
    float: right;
}

.detail_info ul li a {
    font-size: 3.9vw;
    padding: 3.6vw;
    border-radius: 2vw;
}

.detail_info ul li a:before {
    font-size: 3vw;
    padding: 1% 0 0;
}

.detail_original {
    margin: 5% 0 0;
}

.detail_txt {
    font-size: 4vw;
    margin: 5% 0 0;
}

ul.b_site {
    margin: 5% 0 0;
}

ul.b_site li {
    width: 48.5%;
    margin: 0 3% 3% 0;
}

ul.b_site li:nth-child(2n) {
    margin-right: 0;
}


.book_list .book {
    width: 48.5%;
}

section h3.triangle {
    padding-top: 10px;
    font-size: 14px;
}

section h3.triangle::before {
    content: '';
    width: 10px;
    display: inline-block;
    border-top: 10px solid #65c6c7;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    box-sizing: border-box;
    top: 12px;
    left: 10px;
}

ul.original_list {
    margin: 5% 0 0;
}

ul.original_list li {
    width: 48.5%;
    margin: 0 3% 3% 0;
}

ul.original_list li:nth-child(2n) {
    margin-right: 0;
}

ul.original_list li:nth-child(5) {
    margin: 0 3% 3% 0;
}

ul.original_list li:nth-child(n+6)  {
    margin-top: 0;
}

ul.original_list li img {
    width: 100%;
}

.detail_btn {
    margin: 5% 0 0;
}

.detail_btn a {
    display: block;
    width: 100%;
    font-size: 4.5vw;
    padding: 3%;
    border-radius: 2vw;
}

.detail_btn a:before {
    font-size: 3vw;
    padding: 1% 0 0;
}

.twitter_inner {
    margin: 5% 0 0;
    height: 70vw !important;
}

body.form form ul {
    padding: 8% 5%;
    border-radius: 3vw;
}

body.form form ul li dl dd input[type="text"],
body.form form ul li dl dd input[type="number"],
body.form form ul li dl dd input[type="tel"],
body.form form ul li dl dd input[type="email"],
body.form form ul li dl dd input[type="url"] {
    width: 100%;
    font-size: 3.4vw;
    padding: 3%;
}

body.form p.explain {
    font-size: 3.4vw;
}

body.form form ul li dl dd textarea {
    font-size: 3.4vw;
}

body.form form ul li dl dt {
    font-size: 4vw;
    margin: 0 0 4%;
}

body.form form ul li dl dd .error {
    font-size: 3vw;
    margin: 2% 0 0;
}

body.form form ul li dl dt .explain {
    font-size: 2.8vw;
    margin: 3% 0 0;
}

body.form .form_btn input {
    width: 65%;
    font-size: 4vw;
    height: 12vw;
}

body.form form ul li dl dd {
    font-size: 3.4vw;
}


/*ここからキャンペーン用*/

section#prize {
    margin-top: 40px;
    padding-top: 0px;
}

section#prize .kazari img.camp {
    position: absolute;
    left: 50%;
    top: -20%;
    transform: translateX(-50%);
    width: 8%;
}

section#prize h2.camp {
    position: relative;
    text-align: center;
    color: #a98d10;
    padding: 20px 0;
    font-size: 19px;
    font-weight: bold;
    background-image: none;
    line-height: 1.2em;
    letter-spacing: 0.1em;
}

section#prize p {
    font-size: 16px;
    color: #434343;
    margin-top: 5%;
    margin-bottom: 20px;
    line-height: 1.4em;
}

span.s_text {
    font-size: 16px;
}

.prize hr.grade {
    position: absolute;
    left: 50%;
    height: 3px;
    border-width: 0;
    background-color: #00bcd4;
    background-image: linear-gradient(90deg, #a88d10 0%, #f1ca16 50%, #a88d10 100%);
    width: 80%;
    transform: translateX(-50%);
}

.prize {
    background-color: #d3f4fb;
    border-radius: 5px;
    margin-top: 5%;
    width: 100%;
}

.prize h3 {
    text-align: center;
    padding-top: 5%;
}

.prize h3 img {
    width: 75%;
}

.kazari {
    position: relative;
}

img.camp {
    position: absolute;
    left: 50%;
    top: -35%;
    transform: translateX(-50%);
    width: 8%;
}

h3.camp {
    position: relative;
    text-align: center;
    color: #434343;
    padding: 20px 0;
    font-size: 20px;
    font-weight: bold;
    background-image: none;
    line-height: 1.2em;
    letter-spacing: 0.2em;
    margin-bottom: 0px;
}

h3.camp::before,
h3.camp::after {
    position: absolute;
    left: 0;
    width: 100%;
    height: 3px;
    content: '';
    background-image: linear-gradient(135deg, #a88d10 0%, #f1ca16 50%, #a88d10 100%);
}

h3.camp::before {
    margin-left: 0px;
    top: 0;
}

h3.camp::after {
    bottom: 0;
}

section#target h4 .orange {
    font-size: 18px;
}

section#target h4 .s_text {
    font-size: 12px;
}

h4.camp {
    font-size: 18px;
}

section#target p {
    font-size: 16px;
}

#target .nov {
    /*width: 375px;*/
    /*max-width: 100%;*/
    width: 100%;
    position: relative;
    padding-bottom: 10px;
}

#target .nov img.center {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

#target .nov img.right {
    float: right;
}

#target .dec {
    /*width: 375px;*/
    width: 100%;
    position: relative;
    padding-bottom: 40px;
}

#target .dec img.left {
    position: relative;
    left: 24%;
    transform: translateX(-24%)
}

#target .dec img.right {
    position: absolute;
    right: 17%;
}

#target .nov img {
    max-width: 32%;
}

#target .dec img {
    max-width: 32%;
}

section#method p {
    font-size: 16px;
    margin-top: 30px;
}

section#method ol li {
    font-size: 16px;
}

section#method .s_text {
    font-size: 12px;
}

section#method p.caution {
    margin-top: 10px;
}

section#method img {
    padding-bottom: 30px;
    max-width: 80%;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

section#method img.right {
    float: none;
}

#method .address {
    margin-top: 0px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 30px;
}

#method .address p {
    font-size: 12px;
    margin-top: 20px;
}

#method .address p strong {
    font-size: 15px;
}

#method .address h4.camp {
    padding-top: 30px;
}

#method p.deadline {
    font-size: 18px;
    margin-top: 20px;
    padding-top: 0px;
}

#method ul li {
    font-size: 16px;
}


/*フォーム*/

.contact_info ul {
    float: none;
    width: 100%;
}

.contact_info ul {
    overflow: hidden;
}

.contact_info ul li {
    width: 80%;
    margin: 0 auto;
}

.contact_info ul li a {
    font-size: 4vw;
    padding: 3vw;
    border-radius: 2vw;
}

.contact_info ul li a:before {
    font-size: 3vw;
    padding: 1% 0 0;
}

.contact_txt {
    font-size: 4vw;
    margin: 5% 0 0;
}


/*1111_スライドバナー修正*/

.slider_wrap {
    width: 100%;
    overflow: hidden;
    position: relative;
    padding: 0 0 60px;
    margin: 0 0 -60px;
}

.slider_inner_wrap {
    padding: 0;
}

.slider_inner {
    max-width: 1150px;
    margin: auto;
}

.slick-slider {
    margin: 0 auto;
}

.slick-dotted.slick-slider {
    margin: 0;
}

.slick-slide div {
    vertical-align: top;
}

.slick-slide img {
    width: 100%;
    vertical-align: top;
}


/* the slides */

.slick-slide {
    margin: 0 5px;
}


/* the parent */

.slick-list {
    overflow: inherit;
}

.slick-prev:before,
.slick-next:before {
    display: none;
}


/*2021/02/26*/

#info .bg,
#booklist .bg,
.shoplist {
    padding: 0 3%;
}

mv {
    margin: 0 0 5%;
    text-align: center;
}

section h2.title:before {
    display: none;
}

section h2.title img {
    max-width: 50%;
}

section h2.date_title:before {
    display: none;
}

section h2.date_title img {
    max-width: 50%;
}

section h2.date_title {
    margin: 5% 0;
}

#main>section#info {
    margin: 5% 0 0;
}

.date_txt {
    font-size: 7vw;
    margin-top: 0;
}

.date_txt .note {
    font-size: 4vw;
}

#info .info_txt {
    font-size: 4vw;
}

#info .info_txt .bold {
    font-size: 5vw;
}

#info .info_txt .note {
    font-size: 3vw;
}

#info .sample_images .sp {
    margin: 0 auto;
}

#booklist .ttl_list ul li {
    overflow: hidden;
    width: 32%;
    margin: 0 2% 2% 0;
    height: 65vw;
}

#booklist .ttl_list ul li:nth-child(4n) {
    margin: 0 2% 2% 0;
}

#booklist .ttl_list ul li:nth-child(3n) {
    margin-right: 0;
}

#booklist .ttl_list ul li img {
    width: 100%;
}

#booklist .ttl_list ul li p strong {
    font-size: 4vw;
    margin: 4% 0 2%;
    line-height: 1.4em;
}

/*2022/02/01_改修*/

.detail_info .detail_inner h2 {
    font-size: 5vw;
    margin: 0 0 3%;
}

.detail_info .detail_inner h3 {
    margin: 0 0 3%;
    font-size: 4vw;
}


/*2023/12/25_改修*/
.comic_banner{
    margin: 1.5% auto;
}

.ricomi_banner{
    display: block;
    width: 90%;
    max-width: 1020px;
    margin: 0 auto;
}

.ricomi_banner img{
    display: block;
    width: 100%;
}

.site_02{
    margin: 1% 0 0 0  !important;
}

.piccoma{
    margin: 1% 0 0 0  !important;
}

.piccoma a{
    background:#fe9743 !important;
}