@charset "utf-8";

* {
box-sizing: border-box;
margin: 0;
padding: 0;
}

html{
overflow-x: hidden;
scroll-behavior: smooth;
}

body{
margin: 0px;
min-width: fit-content;
font-family: "Zen Maru Gothic", sans-serif;}


h1{
margin: 0;
}

h2{
font-family: "Zen Maru Gothic", sans-serif;
font-size: 32px;
}

.fa-bars:before{
color: #16A6B8;
}

.pc {
display: none !important;
}


.br-pc {
display: block;
}

.br-tab{
display: none;
}

.br-judge{
display: block;
}

@media (min-width: 480px) {
.pc {
display: block !important;
}
}
.sp {
display: block !important;
}
@media (min-width: 540px) {
.br-tab {
display: block !important;
}
}
.tablet {
display: block !important;
}
@media (min-width: 768px) {
.tablet {
display: none !important;
}
}

.head_logo img{
width:50px;
height:50px;
}

header {
width: 100%;
background: #ffffff;
z-index: 1000;
padding: 0;
font-weight:bold;
}

a {
text-decoration: none;
}

header .container {
position: relative;
}

header .container-small {
display: flex;
align-items: center;
justify-content: flex-start;
}

.headA {
padding-left: 10px;
padding-right: 10px;
}

.headA h1 {
margin: 0;
color: #434343;
padding: 0;
}

.headA p {
font-size: 20px;
color: #636363;
}

.headB ul {
margin: 0;
padding: 0;
list-style: none;
}

.headB a,.headB a:link,.headB a:visited{
display: block;
padding: 8px;
color: #16A6B8;
font-size: 16px;
text-decoration: none;
border-bottom: 3px solid none;
}

.headB a:hover {
margin-top: -3px;
border-bottom: 2px solid #16A6B8;
transition: .3s;
}

.headD img{
height: 30px;
}

/* PC */
@media(min-width: 1024px) {
.headA {
padding-left: 12%;
}

.headB {
position: absolute;
right: 12%;
top: 5px;
}

.headB ul {
display: flex
}

.headC {
display: none;
}
}

/* SP */
@media(max-width:1023px) {
.headC {
position: absolute;
right: 10px;
padding: 0;
border: none;
outline: none;
background: none;
font-size: 28px;
opacity: 0.8;
cursor: pointer;
color: #636363;
}

.headC:hover {
opacity: 0.3;
}

.headB {
display: none;
}
}


/* PC */
@media (min-width:1024px) {
.pc { display: block !important; }
.sp { display: none !important; }
}

.top_wrapper{
max-width: 100%;
}

.top_inner{
max-width: 100%;
background-image: url(../img/fv_bg.svg);
background-size: cover;
}

.top_inner picture img{
margin: 0 auto;
padding: 0;
width: 100%;
max-width: 1000px;
}

.fv_lead {
margin: 0 auto;
width: 100%;
background-color: #fff;
padding: 50px 0;
}

.fv_lead p{
font-weight: 500;
font-style: normal;
text-align: center;
font-size: 20px;
line-height: 40px;
color: #16A6B8;
}

.fv_lead p span{
color: #FC8C7A;
}

.content_all {
background-color:#fffde9;
/*overflow: hidden*/;
}

.horizon-border{
height: 65px;
background-image: url(../img/horizon.svg);
background-repeat: repeat-x;
background-position: top;
background-size: cover;
}

.content_category {
background-color:#EAF7FB;
background-image: url(../img/category-bg.svg);
background-size: cover;
/*overflow: hidden;*/
padding: 70px 0;
text-align: center;
}

.category_select {
margin: 70px auto 0 auto;
display: inline-block;
position: relative;
height: 60px;
line-height: 60px;
text-align: center;
letter-spacing: 3px;
padding: 0 50px;
font-size: 28px;
font-weight: 300;
background: #FC8C7A;
color: #FFF;
box-sizing: border-box;
}

.category_select:before, .category_select:after {
position: absolute;
content: '';
width: 0px;
height: 0px;
z-index: 1;
}

.category_select:before {
top: 0;
left: 0;
border-width: 33px 0px 25px 15px;
border-color: transparent transparent transparent #f6fcfd ;
border-style: solid;
}

.category_select:after {
top: 0;
right: 0;
border-width: 33px 15px 25px 0px;
border-color: transparent #f6fcfd  transparent transparent;
border-style: solid;
}

.selecttop:before{
border-color: transparent transparent transparent #EAF7FB ;
}

.selecttop:after{
border-color: transparent #EAF7FB transparent transparent;}

.category_select img{
display: inline;
max-height: 35px;
vertical-align: middle;
margin-top: -9px;
}

/* category */
.category_ttl{
position: relative;
display: block;
text-align: center;
margin: auto;
color: #FC8C7A;
font-family: "Zen Maru Gothic";
font-size: 38px;
font-style: normal;
font-weight: 700;
line-height: 55px;
letter-spacing: 8px;
text-shadow: 2px 2px 0 white, -2px -2px 0 white, 2px -2px 0 white, -2px 2px 0 white, 0 0 4px rgb(188 188 188);
}
.category_ttl::before {
content: attr(data-text);
position: absolute;
color: #4169e1;
-webkit-text-stroke: 1px #FFF;
}
.category_ttl img{
display: inline-block;
max-height: 50px;
}

.category_list{
margin: 30px auto;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
align-content: flex-start;
width: 100%;
max-width: 1000px;
overflow: auto;
flex-direction: row;
}

.category_name{
width: 32%;
margin: 40px 5px 20px 5px;

}

.category_frame:before,
.category_frame:after {
position: absolute;
content: '';
}

.category_frame:before {    
top: -45px;
left: calc(50% - 45px);
width: 80px;
height: 80px;
border: 8px solid #fff;
border-radius: 50%;
background: #FFF6F6;
}

.category_frame {
position: relative;
text-align: center;
border: 8px solid #fff;
background: #FFF6F6;
border-radius: 20px;
box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
}
.category_frame:after {
left: 0;
top:0;
width:100%;
height: 100%;
background: #FFF6F6;
border-radius: 20px;
}

.category_frame-txt {
position: relative;
z-index: 1;
display: block;
padding: 10px;
}

.category_frame-txt:before,
.category_frame-txt:after {
position: absolute;
content: '';
}

.category_frame-txt:before {
top: -58px;
left: calc(50% - 34px);
width: 68px;
height: 40px;
border-radius: 50vw 50vw 0 0;
}

.category_frame-txt:after {
position: absolute;
top: -30px;
left: calc(50% - 37px);
width: 64px;
height: 10px;
font-size: 27px;
font-family: "Tilt Warp", sans-serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
font-variation-settings:
"XROT" 0,
"YROT" 0;
}
.category_frame-txt{
background-repeat: no-repeat;
background-size: 80%;
background-position: right;
background-position: top right;
}
.category_frame-txt h4{
font-size: 26px;
text-shadow:2px 3px 0px white,
-2px  -2px 0px white,
2px -1px 0px white,
-2px  2px 0px white;
margin-bottom: 5px;
}
.category_frame-txt span{
font-size: 15px;
line-height: 24px;
color: #4B4B4B;
font-weight: 500;
letter-spacing: -1px;
}
.category_frame-txt a{
display: inline-block;
margin: 10px auto;
border-radius: 20px;
color: #fff;
font-weight: 500;
padding: 8px;
box-shadow: 0px -2px 0px 0px rgba(0, 0, 0, 0.25) inset;
}
.category_frame-txt a:hover{
opacity: 0.5;
transition: .3s;
}
.cat_one > .category_frame-txt:after {
content: "1";
color: #FC8C7A;
}
.cat_one > .category_frame-txt h4 {
color: #FC8C7A;
}
.cat_one > .category_frame-txt a{
background-color: #FC8C7A;
}
.cat_one >.category_frame-txt{
background-image: url(../img/categoy_bg-1.png);
}
.cat_two > .category_frame-txt:after {
color: #A85F0C;
content: "2";
}
.cat_two > .category_frame-txt h4 {
color: #A85F0C;
}
.cat_two > .category_frame-txt a{
background-color: #A85F0C;
}
.cat_two:before {    
background: #FFFFDD;
}
.cat_two {
background: #FFFFDD;
}
.cat_two:after {
background: #FFFFDD;
}
.cat_two >.category_frame-txt{
background-image: url(../img/categoy_bg-2.png);
}
.cat_three > .category_frame-txt:after {
color: #70A85F;
content: "3";
}
.cat_three > .category_frame-txt h4 {
color: #70A85F;
}
.cat_three > .category_frame-txt a{
background-color: #70A85F;
}
.cat_three:before {    
background: #E3F2DF;
}
.cat_three {
background: #E3F2DF;
}
.cat_three:after {
background: #E3F2DF;
}
.cat_three >.category_frame-txt{
background-image: url(../img/categoy_bg-3.png);
}
.cat_four > .category_frame-txt:after {
color: #B563A5;
content: "4";
}
.cat_four > .category_frame-txt h4 {
color: #B563A5;
}
.cat_four > .category_frame-txt a{
background-color: #B563A5;
}
.cat_four:before {    
background: #FFF5FD;
}
.cat_four {
background: #FFF5FD;
}
.cat_four:after {
background: #FFF5FD;
}
.cat_four >.category_frame-txt{
background-image: url(../img/categoy_bg-4.png);
}
.cat_five > .category_frame-txt:after {
color: #715DBD;
content: "5";
}
.cat_five > .category_frame-txt h4 {
color: #715DBD;
}
.cat_five > .category_frame-txt a{
background-color: #715DBD;
}
.cat_five:before {    
background: #F5F7FF;
}
.cat_five {
background: #F5F7FF;
}
.cat_five:after {
background: #F5F7FF;
}
.cat_five >.category_frame-txt{
background-image: url(../img/categoy_bg-5.png);
background-size: 50%;
background-position: bottom right;
}

/* course */
.course_list{
margin: 30px auto;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
align-content: flex-start;
width: 100%;
max-width: 1000px;
overflow: auto;
flex-direction: row;
color: #4B4B4B;
font-weight: 500;
}

.course_name{
width: 49%;
margin: 50px 5px 0 5px;
}
.course_frame {
position: relative;
text-align: center;
border: 8px solid #fff;
background: #FFF6F6;
border-radius: 20px;
box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
}
.course_frame:before {
top: -55px;
left: calc(50% - 140px);
width: 280px;
height: 100px;
border: 8px solid #fff;
border-radius: 20px;
background: #FFF6F6;
}
.course_frame:after {
left: 0;
top: 0;
width: 100%;
height: 100%;
background: #FFF6F6;
border-radius: 20px;
}
.course_frame:before, .course_frame:after {
position: absolute;
content: '';
}
.course_frame-txt {
position: relative;
z-index: 1;
display: block;
padding: 10px;
}

.course_frame-txt:after {
position: absolute;
top: -40px;
left: 0;
width: 100%;
height: 10px;
font-size: 24px;
font-weight: 700;
}
.course_frame-txt:before {
top: -58px;
left: calc(50% - 34px);
width: 68px;
height: 40px;
border-radius: 50vw 50vw 0 0;
}
.course_frame-txt{
background-repeat: no-repeat;
background-position: right bottom;
padding: 20px;
min-height: 215px;
display: flex;
align-items: center;
justify-content: center;
}

.cou_one > .course_frame-txt:after {
color: #4BA9B4;
content: "ツカミ漫画コース";
}
.cou_one:before {    
background: #DDF7FA;
}
.cou_one {
background: #DDF7FA;
}
.cou_one:after {
background: #DDF7FA;
}
.cou_one >.course_frame-txt{
background-image: url(../img/cou_bg-1.svg);
}
.cou_two > .course_frame-txt:after {
color: #FF596A;
content: "読みきり漫画コース";
}
.cou_two:before {    
background: #FFEBF2;
}
.cou_two {
background: #FFEBF2;
}
.cou_two:after {
background: #FFEBF2;
}
.cou_two >.course_frame-txt{
background-image: url(../img/cou_bg-2.svg);
}

.course_attention{
margin: 10px 15px;
text-align: center;
}

/* prize */
.content_prize{
background-color: #F2F7F9;
/*overflow: hidden;*/
text-align: center;
padding: 70px 0 240px 0;
}

.prize_course-wrap{
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
margin: 80px auto 30px auto;
max-width: 1000px;
}

.prize_course{
position: relative;
width: 48%;
border-radius: 10px;
background: #FFF;
box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
padding: 20px;
}

.prize_course img{
margin-top: 20px;
}

.prize_course-ttl{
position: absolute;
top: -5px;
right: 0;
left: 0;
margin: 0 auto;
transform: translate(0,-50%);
text-align: center;
color: #16A6B8;
font-size: 28px;
background-color: #fff;
border-radius: 20px;
border: solid 2px #16A6B8;
box-shadow: 4px 7px 0px 0px #16A6B8;
width: 350px;
}

.prize_present{
margin: auto;
max-width: 1000px;
width: 100%;
background-color: #fff;
border-radius: 100px;
border: solid 2px #FC8C7A;
padding: 20px;
filter: drop-shadow(5px 5px 0px #FC8C7A);
font-size: 18px;
color: #747474;
}

.prise_present-txt span{
color: #FC8C7A;
font-weight: 700;
font-size: 25px;
}

.prise_present-txt span.present{
font-size: 20px;
color: #747474;
}

.prise_present-txt span.mini{
color: #747474;
font-weight: 300;
font-size: 15px;
}
.horizon-wave{
background-image: url(../img/judge_bg.svg);
height: 162px;
margin-top: -160px;
background-position: center;
background-size: cover;
}

.apply-wave{
background-image: url(../img/apply_bg.svg);
height: 240px;
margin-top: -50px;
background-position: center;
background-size: cover;
}

.content_judge{
background-color: #fff;
/*overflow: hidden;*/
text-align: center;
padding: 30px 0 120px 0;
}

.judge-wrap{
display: flex;
flex-wrap: wrap;
max-width: 1000px;
margin: 50px auto;
align-items: center;
}

.judge-box {
width: 28%;
margin: 0 auto;
border: 5px solid #FC8C7A;
border-radius: 20px;
box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
}

.judge-box .judge-box-title {
padding: 20px 0;
background: #FC8C7A;
color: #fff;
border-radius: 15px 15px 0 0;
background-image: url(../img/nagare_bg.svg);
background-size:auto;
background-position: center top -25px;
background-repeat: no-repeat;
font-size: 20px;
font-weight: 700;
height: 150px;
}

.judge-box .judge-box-content {
padding: 20px 2px;
height: 210px;
display: flex;
align-items: center;
justify-content: center;
}

.judge-box .judge-box-content p {
color: #797979;
font-weight: 500;
margin: 0;
}

.judge-big{
color: #FC8C7A;
}

.judge-mini{
display: block;
font-size: 14px;
margin-top: 10px;
}

.judge-box-title span,
.judge-box-title img{
display: block;
text-align: center;
margin: auto;
}

.judge-box-title .margintop{
margin-top: 18px;
}

.content_apply{
background-color: #FDF8F3; 
padding-bottom: 70px;
}
.time-wrap{
margin: 85px auto;
max-width: 1000px;
width: 100%;
background-color: #FDF8F3;
}
.time-block{
position: relative;
width:100%;
border:solid 3px #FC8C7A;
border-radius: 20px;
background-color: #fff;
padding: 30px 0 0 0;
text-align: center;
box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
margin: 20px auto 50px auto;
}

.ribbon {
position: absolute;
left: 0;
right: 0;
margin: auto;
top: -25px;
font-size: 28px;
font-weight: 300;
color: #fff;
}
.ribbon {
--r: .5em; 
padding-inline: calc(var(--r) + .3em);
line-height: 1.8;
clip-path: polygon(0 0,100% 0,calc(100% - var(--r)) 50%,100% 100%,0 100%, var(--r) 50%);
background: #FC8C7A;
width: 300px;
text-align: center;
margin: auto;
font-weight: 700;
letter-spacing: 3px;
}

.time-start{
font-size: 30px;
color: #FC8C7A;
font-weight: 700;
margin-bottom: 10px;
}

.time-start img{
display: inline;
margin: 0 20px;
}

.day{
font-size:50px;
}

.week{
color: #fff;
background-color: #FC8C7A;
border-radius: 20px;
padding: 2px 7px;
font-size: 20px;
margin-bottom: 10px;
vertical-align: middle;
display: inline-block;
}

.time-attention{
font-size: 17px;
display: block;
margin-bottom: 20px;
}

.apply-wrap{
margin: 70px auto;
max-width: 1000px;
width: 100%;
background-color: #FDF8F3;
}

.apply-block{
position: relative;
border-radius: 10px;
background: #FFF;
box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
padding: 0 40px 40px 40px;
}

.apply-cont{
display: flex;
flex-wrap: wrap;
align-items: flex-start;
border-bottom: dotted 1px #797979;
padding: 30px 0;
}

.apply-block > div:last-child{
border-bottom:none;
}

.apply-ttl{
color: #fff;
background-color: #FC8C7A;
width: 120px;
padding: 5px 10px;
text-align: center;
border-radius: 10px;
font-weight: 700;
}

.apply-txt{
margin-left: 20px;
color: #797979;
font-weight: 500;
max-width: 700px;
}

.color{
color: #FC8C7A;
}

.marker{
background: linear-gradient(transparent 50%, #f8dbd6 50%);
}

.entry-wrap{
max-width: 1000px;
width: 100%;
margin: auto;
text-align: center;
display: flex;
flex-wrap: wrap;
justify-items: center;
justify-content: center;
padding: 60px 0;
}

a.entry{
color: #fff;
font-size: 20px;
background-color: #FF6E99;
font-weight: 700;
text-align: center;
padding: 10px 0;
width: 32%;
border-radius: 25px;
display: block;
margin: 8px 5px;
filter: drop-shadow(3px 3px 0px #dc557e);
}

/* PC */
@media(min-width: 1024px) {
.headA {
padding-left: 12%;
}

.headB {
position: absolute;
right: 12%;
top: 5px;
}

.headB ul {
display: flex
}

}

/* SP */
@media(max-width:1023px) {
.headB {
display: none;
}
}

@media (max-width:820px) {
.fv_lead p {
font-size: 18px;
line-height: 35px;
}

.category_name {
width: 48%;
}

.course_name{
width: 48%;
}

.course_frame-txt{
min-height: 235px;
}

.prize_present{
width: 98%;
}

.judge-box {
width: 30%;
}

.arrow{
width: 2%;
margin-left: 5px;
}

.time-wrap{
width: 98%;
}

.apply-wrap{
width: 98%;
}

a.entry{
font-size: 16px;
}

.apply-ttl{
width: 100%;
}

.apply-txt {
margin-top: 20px;
margin-left: 10px;}

.br-tab{
display: block;
}
.br-pc {
display: none;
}
}

@media (max-width:767px) {
.fv_lead {
padding: 35px 0;
}
.fv_lead p {
font-size: 16px;
line-height: 26px;
}

.content_category{
padding: 30px 0;
}

.category_ttl{
font-size: 32px;
line-height: 47px;
}

.category_ttl img {
max-height: 40px;
}

.category_select {
margin: 30px auto 0 auto;
}

.prize_course {
position: relative;
width: 98%;
text-align: center;}

.prize_course img{
margin: 20px auto;
text-align: center;
width: 100%;
max-width: 500px;
}
.prize_course-wrap {
gap: 60px;}

.judge-box {
width: 42%;
margin: 0 auto 20px auto;
}

.judge-wrap > div:nth-child(4){
margin: 0 0 0 20%;
}

.judge-wrap > div:nth-child(5){
margin: 0 0 0 30px;
}

.time-wrap {
margin: 75px auto;}

.apply-wrap {
margin: 60px auto;}
}

@media(max-width:540px) {

header .container-small{
padding: 5px 0;
}

.br-judge{
display: none;
}
.top_inner picture img{
max-width: 100%;	
}

.headB {
display: none;
}

.fv_lead p{
font-size: 14px;
line-height: 22px;
}

.fv_lead {
margin: 0 auto;
padding: 20px 0;
}

.category_ttl img {
max-height: 30px;
}
.category_ttl {
font-size: 25px;
line-height: 40px;
text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 0 0 4px rgb(97, 97, 97);
}
.category_select{
font-size: 20px;
height: 50px;
line-height: 50px;
}
.category_select img {
display: inline;
max-height: 25px;
vertical-align: middle;
margin-top: -7px;
}

.category_select:before{
border-width: 25px 0px 25px 15px;
}

.category_select:after{
border-width: 25px 15px 25px 0px;
}
.category_name {
width: 100%;
}

.category_frame-txt a {
display: block;
max-width: 300px;}

.course_name {
width: 100%;
margin-bottom: 20px;
}
.course_frame-txt{
padding: 10px;
font-size: 15px;
}
.prize_course-wrap{
margin: 60px auto 30px auto;
}

.prize_course{
padding: 4% 2%;
}

.prize_course-ttl {
font-size: 23px;
box-shadow: 3px 4px 0px 0px #16A6B8;
width: 300px;
}

.prize_present{
border-radius: 10px;
font-size: 15px;
filter: drop-shadow(3px 3px 0px #FC8C7A);
padding: 10px;
}

.prise_present-txt span {
font-size: 17px;
}
.judge-wrap {
margin: 20px auto;
}

.horizon-wave{
height: 39px;
margin-top: -192px;
background-position: bottom;
background-size: contain;
background-repeat: no-repeat;
}
.content_prize{
padding: 60px 0 240px 0;

}

.content_judge{
margin-top: -5px;}

.content_apply {
margin-top: -8px;
padding-top: 40px;
}

.apply-wave {
height: 51px;
margin-top: -68px;
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
.judge-box {
width: 95%;
margin: 20px auto;}

.judge-box .judge-box-content{
height: initial;
}

.arrow {
width: 100%;
}

.arrow img{
margin: auto;
text-align: center;
transform: rotate(90deg);}

.judge-box .judge-box-title{
background-size: cover;
}

.judge-wrap > div:nth-child(4){
margin: auto;
}

.judge-wrap > div:nth-child(5){
margin: 20px auto;
}

.judge-box .judge-box-title{
height: 125px;
}

.judge-box-title .margintop {
margin-top: 10px;
}
.judge-box-title span{
margin-top: 10px;
}
.apply-block{
padding: 0 10px 10px 10px;
}
.time-wrap {
margin: 55px auto;
padding-bottom: 10px;
}
.apply-wrap {
margin: 40px auto;
}

.entry-wrap{
padding: 40px 0;
}
a.entry{
width: 100%;
}
.time-block{
padding: 16px 0 0 0;
}
.time-start {
font-size: 25px;}
.day{
font-size: 38px;
}
.time-start img {
margin: 0 10px;
width: 30px;
}
.ribbon {
top: -20px;
font-size: 20px;}

.week {
padding: 2px 5px;
font-size: 14px;}

.apply-txt{
margin-left: 0;
}
}

@media (max-width: 540px) {
.br-tab {
display: none !important;
}
}


a.pagetop {
height: 150px;
width: 150px;
position: fixed;
right: 30px;
bottom: 100px;
background: #FC8C7A;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
z-index: 2;
text-align: center;
color: #fff;
font-size: 22px;
font-weight: 500;
text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.25);
filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
}

@media (max-width: 540px) {
a.pagetop {
right: 10px;
bottom: 10px;
height: 90px;
width: 90px;
font-size: 14px;
}
}


/* あとで消す　フッター整形 */

.footer {
background: #f5f5f5;
border-top: 1px solid #e6e6eb;
padding: 32px 4vw 12px
}

@media (min-width: 480px) {
.footer {
padding:40px 4vw 24px
}
}

@media (min-width: 1080px) {
.footer {
padding-bottom:32px
}
}

@media (min-width: 1280px) {
.footer {
padding:40px 0 32px
}
}

.footer__inner {
max-width: 1280px;
margin: 0 auto
}

@media (min-width: 768px) {
.footer__description {
display:flex;
align-items: center;
border-bottom: 1px solid #e6e6eb;
padding-bottom: 40px
}
}

.footer__description .logo {
width: 150px;
margin: 0 auto
}

@media (min-width: 768px) {
.footer__description .logo {
width:170px
}
}

@media (min-width: 1080px) {
.footer__description .logo {
width:220px
}
}

.footer__description-text {
margin-top: 16px;
font-size: 10px;
text-align: center
}

@media (min-width: 321px) {
.footer__description-text {
font-size:11px
}
}

@media (min-width: 480px) {
.footer__description-text {
font-size:12px;
}
}

@media (min-width: 768px) {
.footer__description-text {
margin-top:12px;
text-align: left;
padding-left: 16px;
width: calc(100% - 170px)
}
}

@media (min-width: 1080px) {
.footer__description-text {
width:calc(100% - 220px);
padding-left: 32px
}
}

.footer__nav-area {
padding: 24px 0 0
}

@media (min-width: 480px) {
.footer__nav-area {
padding:32px 0 0
}
}

@media (min-width: 1280px) {
.footer__nav-area {
display:flex;
align-items: center;
justify-content: space-between
}
}

.footer .footer-nav {
margin-bottom: 16px
}

@media (min-width: 480px) {
.footer .footer-nav {
margin-bottom:24px
}
}

@media (min-width: 1280px) {
.footer .footer-nav {
margin-bottom:0
}
}

.footer .footer-nav__list {
border-bottom: 1px solid #e6e6eb;
display: flex;
flex-wrap: wrap
}

@media (min-width: 768px) {
.footer .footer-nav__list {
border-bottom:none;
justify-content: center
}
}

.footer .footer-nav__item {
border-top: 1px solid #e6e6eb;
width: 50%;
padding: 6px 0
}

@media (min-width: 768px) {
.footer .footer-nav__item {
width:auto;
border-top: none;
padding: 0
}
}

.footer .footer-nav__item a {
display: block;
text-align: center;
color: #4a4a4a;
font-size: 12px;;
padding: 6px 0
}

@media (min-width: 480px) {
.footer .footer-nav__item a {
font-size:14px
}
}

@media (min-width: 768px) {
.footer .footer-nav__item a {
padding:0;
text-align: left;
display: flex;
align-items: center
}

.footer .footer-nav__item a:before {
content: "";
display: block;
width: 1px;
height: 12px;
background: #d2d2d6;
margin-left: 20px;
margin-right: 20px
}
}

@media (min-width: 768px) {
.footer .footer-nav__item:first-child a:before {
content:none
}
}

.footer .footer-nav__item:nth-child(odd) a {
border-right: 1px solid #e6e6eb
}

@media (min-width: 768px) {
.footer .footer-nav__item:nth-child(odd) a {
border-right:none
}
}

@media (min-width: 768px) {
.footer .footer-sub-nav {
display:flex;
justify-content: center
}
}

.footer .footer-sub-nav__list {
display: flex;
flex-wrap: wrap;
justify-content: center
}

.footer .footer-sub-nav__list:first-of-type .footer-sub-nav__item:first-child a:before {
content: none
}

.footer .footer-sub-nav__item a {
font-size: 11px;
color: #4a4a4a;
padding: 4px 0;
display: flex;
align-items: center
}

@media (min-width: 480px) {
.footer .footer-sub-nav__item a {
font-size:12px;
}
}

@media (min-width: 768px) {
.footer .footer-sub-nav__item a {
padding:0
}
}

.footer .footer-sub-nav__item a:before {
content: "";
display: block;
width: 1px;
height: 12px;
background: #d2d2d6;
margin-left: 16px;
margin-right: 16px
}

.footer .footer-sub-nav__item:first-child a:before {
content: none
}

@media (min-width: 768px) {
.footer .footer-sub-nav__item:first-child a:before {
content:"";
display: block;
width: 1px;
height: 12px;
background: #d2d2d6;
margin-left: 16px;
margin-right: 16px
}
}

.footer__bottom-area {
border-top: 1px solid #e6e6eb;
margin-top: 20px;
padding-top: 24px
}

@media (min-width: 480px) {
.footer__bottom-area {
margin-top:24px;
padding-top: 20px
}
}

@media (min-width: 768px) {
.footer__bottom-area {
margin-top:32px;
padding-top: 24px
}
}

@media (min-width: 1080px) {
.footer__bottom-area {
display:flex;
align-items: center;
justify-content: space-between
}
}

.footer .editor-dep {
width: 280px;
margin: 0 auto
}

@media (min-width: 480px) {
.footer .editor-dep {
width:auto;
display: flex;
justify-content: center
}
}

@media (min-width: 1080px) {
.footer .editor-dep {
display:block;
margin: 0
}
}

.footer .editor-dep__list {
display: flex;
flex-wrap: wrap;
align-items: center
}

@media (min-width: 480px) {
.footer .editor-dep__list {
justify-content:center
}
}

@media (min-width: 1080px) {
.footer .editor-dep__list {
justify-content:flex-start
}
}

.footer .editor-dep__item {
width: 33.3%;
margin-top: 24px
}

.footer .editor-dep__item:first-child,.footer .editor-dep__item:nth-child(2),.footer .editor-dep__item:nth-child(3) {
margin-top: 0
}

@media (min-width: 480px) {
.footer .editor-dep__item {
width:auto;
margin-right: 24px;
margin-top: 8px;
margin-bottom: 8px
}

.footer .editor-dep__item:first-child,.footer .editor-dep__item:nth-child(2),.footer .editor-dep__item:nth-child(3) {
margin-top: 8px
}

.footer .editor-dep__item:last-child {
margin-right: 0
}
}

.footer .editor-dep__item a {
display: block
}

.footer .editor-dep__item a img {
margin: 0 auto;
display: block
}

.footer .editor-dep__item--ribon a img {
height: 18px
}

@media (min-width: 768px) {
.footer .editor-dep__item--ribon a img {
height:20px
}
}

.footer .editor-dep__item--margaret a img {
height: 18px
}

@media (min-width: 768px) {
.footer .editor-dep__item--margaret a img {
height:20px
}
}

.footer .editor-dep__item--betsuma a img {
height: 18px
}

@media (min-width: 768px) {
.footer .editor-dep__item--betsuma a img {
height:20px
}
}

.footer .editor-dep__item--cookie a img {
height: 16px
}

@media (min-width: 768px) {
.footer .editor-dep__item--cookie a img {
height:18px
}
}

.footer .editor-dep__item--cocohana a img {
height: 20px
}

@media (min-width: 768px) {
.footer .editor-dep__item--cocohana a img {
height:22px
}
}

.footer .editor-dep__item--mangamee a img {
height: 20px
}

@media (min-width: 768px) {
.footer .editor-dep__item--mangamee a img {
height:22px
}
}

.footer .editor-dep__item--themargaret a img {
height: 24px
}

@media (min-width: 768px) {
.footer .editor-dep__item--themargaret a img {
height:26px
}
}

.footer .editor-dep__item--degima a img {
height: 18px
}

@media (min-width: 768px) {
.footer .editor-dep__item--degima a img {
height:20px
}
}

.footer .editor-dep__item--kimikoi a img {
height: 18px
}

@media (min-width: 768px) {
.footer .editor-dep__item--kimikoi a img {
height:20px
}
}

@media (min-width: 480px) and (min-width:768px) {
.footer .editor-dep__item {
margin-right:32px
}

.footer .editor-dep__item:last-child {
margin-right: 0
}
}

@media (min-width: 480px) and (min-width:1080px) {
.footer .editor-dep__item {
margin-right:40px
}

.footer .editor-dep__item:last-child {
margin-right: 0
}
}

.footer .copyright {
text-align: center;
margin-top: 20px;
line-height: 1
}

@media (min-width: 480px) {
.footer .copyright {
margin-top:16px
}
}

@media (min-width: 768px) {
.footer .copyright {
margin-top:22px
}
}

@media (min-width: 1080px) {
.footer .copyright {
text-align:right;
margin-top: 0;
flex-shrink: 0;
padding-left: 40px
}
}

.footer .copyright small {
font-size: 10px;
color: #9b9b9b
}

@media (min-width: 480px) {
.footer .copyright small {
font-size:11px
}
}

.l_content-bottom {
    margin-top: 0;
}

@media (min-width: 768px) {
    .l_content-bottom {
        margin-top: 0;
    }
}