@charset "utf-8";

@media only screen and (max-width:768px){
}

/*BASIC Layout start*/
#contentsWrap { width: 100%; height: auto; display: flex; }

header { width: 310px; padding: 2rem; background: #fff; position: fixed; top: 0; }
header h1 { width: 100%; display: block; margin: 0 auto 2rem; }
header nav { width: 100%; display: block; margin: 2rem auto 0; }
header nav ul { width: 100%; }
header nav li { margin: 1rem auto; }
header nav li a { display: block; width: 100%; height: auto; }
header nav li img { display: block; width: 100%; height: auto; }

#contentsBody { /*width: calc(100% - 310px);*/ height: auto; background: rgb(174,238,255); background: linear-gradient(90deg, rgba(174,238,255,1) 0%, rgba(174,238,255,1) 25%, rgba(95,221,255,1) 25%, rgba(95,221,255,1) 50%, rgba(52,194,244,1) 50%, rgba(52,194,244,1) 75%, rgba(0,164,221,1) 75%, rgba(0,164,221,1) 100%); padding: 2rem; margin-left: 310px; width: 100%; }

.subMenu { display: flex; justify-content: flex-end; padding-right: 70px; }
.subMenu ul { display: flex; background: rgba(255,255,255,0.7); border-radius: 30px; padding: 1.5rem; }
.subMenu ul li a { padding: 0.7rem 2rem; }

.pageContents { margin: 2rem; padding: 2rem; background: #fff; height: auto; box-shadow: 0px 0px 7px -5px #777777; position: relative; }

footer { width: 100%; display: flex;justify-content: space-between; align-items: flex-end; padding: 4rem 2rem; background: #44505A; z-index: 99; position: relative; }
footer div:nth-of-type(1) li { margin: 1rem 0; }
footer div:nth-of-type(1) li a { font-size: 2.0rem; font-weight: 700; color: #fff; } 
footer div:nth-of-type(1) li a span { font-size: 1.6rem; font-weight: 500; }
footer .subMenu { margin-bottom: 3rem; padding-right: 0; }
footer .subMenu ul { background: none; }
footer .subMenu a { color: #fff; }
footer p { color: #fff; text-align: right; padding-right: 30px; }

@media only screen and (max-width:768px){
    header { position: static; }
    header h1 { width: 80%; display: block; margin: 0 auto 2rem; }
    #contentsWrap { width: 100%; height: auto; display: block; }
    header { width: 100%; padding: 2rem; background: #fff; }
    header nav { display: none; }
    #contentsBody { width: 100%; padding: 1rem; margin: 0; }
    .subMenu { display: none; }
    footer { display: block; }

}


/*BASIC Layout end*/

/*PAGE Layout*/
/*HOME*/
.home .pageContents { min-height: 82vh; overflow: hidden; }

.home .imagePanel { /*position: absolute;*/ width: 100%; }
.home .imagePanel.c02 div h2 { margin-bottom: 1rem; }
.home .imagePanel.c02 div p { margin-bottom: 1rem; }
.home .imagePanel img { width: 98%; height: auto; display: block; }
.home .imagePanel div { width: 400px; height: 300px; position: absolute; top:30%; left: 30%; padding: 3rem; box-shadow: 7px 7px 0px 0px #777777; }
.home .imagePanel div h2 { display: block; text-align: center; font-size: 4.0rem; font-weight: 700; color: #fff; margin-bottom: 2rem; }
.home .imagePanel div h2 span { display: block; text-align: center; font-size: 2.0rem; color: #fff; }
.home .imagePanel div p { display: block; text-align: center; font-size: 1.6rem; color: #fff; margin-bottom: 2rem; }
.home .imagePanel div a { width: 100%; display: inline-block; position: relative; /*border: solid 2px #fff;*/ padding: 1.4rem 0; text-align: center; font-size: 2.0rem; font-weight: 700; color: #fff; }
.home .imagePanel div p.waku { border: solid 2px #fff; padding: 1.4rem 0; }
/*.home .imagePanel div a:after { content: ''; width: 0; height: 0; border-style: solid; border-width: 10px 0 10px 13px; border-color: transparent transparent transparent #fff; position: absolute; top: 50%; right: 5%; margin-top: -10px; }*/
.home .c01 { display: block; position: absolute; }
.home .c02 { display: none; position: absolute; }
.home .c03 { display: none; position: absolute; }
.home .c04 { display: none; position: absolute; }
.home .c01 div { background: #DC2873; }
.home .c02 div { background: #32A2D3; }
.home .c03 div { background: #0C6BB0; }
.home .c04 div { background: #8FC31F; }
.home .show { display: block; }

.home .fsb { font-size: 1.2em; font-weight: 700; }

@media only screen and (max-width:768px){
    .home .pageContents { min-height: auto; overflow: inherit; }
    .home .c01 { display: block; position: relative; margin-bottom: 2rem; }
    .home .c02 { display: block; position: relative; margin-bottom: 2rem; }
    .home .c03 { display: block; position: relative; margin-bottom: 2rem; }
    .home .c04 { display: block; position: relative; margin-bottom: 2rem; }
    .home .imagePanel img { width: 100%; }
    .home .imagePanel div { width: 100%; height: auto; position: relative; top: auto; left: auto; padding: 3rem; box-shadow: none; }
    .home .imagePanel div h2 { font-size: 2.4rem; }
    .home .imagePanel div h2 span { font-size: 1.4rem; }
    .home .imagePanel div a { font-size: 1.6rem; font-weight: 700; color: #fff; }
    .home .imagePanel div p { font-size: 1.2rem; }
}



/*INPAGE COMMON*/
.pageContents:has(.pageHeader) { padding: 0rem; }
.pageHeader .inpageVisual { width: 50%; height: auto; }
.pageHeader .inpageText { width: 50%; padding: 10rem 0 0; }
.inpageText h2 { display: block; text-align: center; font-size: 4.0rem; font-weight: 700; color: #fff; margin-bottom: 2rem; }
.inpageText h2 span { display: block; text-align: center; font-size: 2.0rem; color: #fff; }
.inpageText p { display: block; text-align: center; font-size: 1.6rem; color: #fff; margin-bottom: 2rem; }
.inPageNavi { padding: 1rem; justify-content: flex-start;
width: 100%; }

.inPageNavi.fixed { position: fixed; top: 0; z-index: 10; }
.c01 .inPageNavi { background: #DC2873; }
.c02 .inPageNavi { background: #32A2D3; }
.c03 .inPageNavi { background: #0C6BB0; }
.c04 .inPageNavi { background: #8FC31F; }

.inPageNavi a { margin:0 2rem; padding: 1rem; color: #fff; font-weight: 700; }

.shortMovie iframe { width: 100%; height: 360px; }



@media only screen and (max-width:768px){
    .pageHeader .flex { display: block; }
    .pageHeader .inpageVisual { width: 100%; height: auto; }
    .pageHeader .inpageText { width: 100%; padding: 1rem; }
    .inpageText h2 { font-size: 2.0rem; }
    .inpageText h2 span { font-size: 1.6rem; }
    .inpageText p { font-size: 1.4rem; }
    .inPageNavi { display: block; }
    .inPageNavi a { display: block; }
}


article { padding: 2rem; }
article h3 { margin-bottom: 1rem; }
article h3 a { font-size: 2.4rem; font-weight: 700; }
article h3 span { font-size: 1.8rem; padding: 0 1rem; }
article .mainImage { display: block; width: 100%; height: auto; margin: 2rem auto; }
article .corpName { font-size: 1.6rem; font-weight: 700; color: #000; margin-bottom:1rem; }
article .corpUrl a { font-size: 1.6rem; font-weight: 500; color: #0C6BB0!important; margin-bottom:1rem; text-decoration: underline; }
article .corpText { font-size: 1.6rem; font-weight: 500; color: #000; margin-bottom:1rem; line-height: 1.6; }
article .btn { width: 50%; display: block; margin: 2rem auto; padding: 2rem 2rem 2rem 1rem; font-size: 2.0rem; font-weight: 700; border-radius: 0; position: relative; }
article .btn:after { content: ''; width: 0; height: 0; border-style: solid; border-width: 10px 0 10px 13px; border-color: transparent transparent transparent #fff; position: absolute; top: 50%; right: 5%; margin-top: -10px; }
article .flex:has(.subImage) { justify-content: space-around; margin: 1.5rem 0; }
article .subImage { max-width: 48%; height: auto; }
article .subArticle { margin: 6rem auto; justify-content: space-between; }
.moviebox { margin: 6rem auto; justify-content: space-between; }
article .subArticleText { width: calc(100% - 330px); }

@media only screen and (max-width:768px){
    article { padding: 0; }
    article h3 img{ width: 30px; height: auto; }
    article h3 a { font-size: 1.4rem; }
    article h3 span { font-size: 1.4rem; display: block; }
    article .corpName { font-size: 1.2rem; }
    article .corpUrl a { font-size: 1.2rem; }
    article .corpText { font-size: 1.3rem; }
    article .btn { width: 90%; font-size: 1.2rem; padding-right: 3rem; padding-left: 1rem; }
    article .subArticle { margin: 0 auto 10rem; padding-top: 2rem; display: block; border-top: dashed 1px #ccc; }
    .moviebox{margin: 0 auto 4rem; padding-top: 2rem; display: block; border-top: dashed 1px #ccc; }
    article .subArticleText { width: 100%; }

}



/*C01*/
.c01 .pageHeader { background: #DC2873; }
.c01 article h3 a { color:#DC2873; font-size: 2.6rem; }
.c01 article .corpName { font-size: 2.2rem; }
.c01 article .corpUrl a { font-size: 2rem; }
.c01 article .corpText { font-size: 2rem; }
.c01 article .btn { background:#DC2873; }
@media only screen and (max-width:768px){
    .c01 article h3 a { font-size: 1.8rem; }
    .c01 article .corpName { font-size: 1.6rem; }
    .c01 article .corpUrl a { font-size: 1.2rem; word-break: break-all; }
    .c01 article .corpText { font-size: 1.4rem; }
    .c01 article .btn { background:#DC2873; }
}


/*C02*/
.c02 .pageHeader { background: #32A2D3; }
.c02 article h3 { color:#32A2D3; font-size: 2.6rem; font-weight: 700; }
.c02 h4 { background: #32A2D3; color: #fff; font-size: 2.4rem; font-weight: 700; padding: 1rem; margin: 0 auto 1rem; }
.c02 article .corpName { font-size: 2.0rem; }
.head_corpName  { font-size: 1.6rem; font-weight: 700; color: #000; margin-bottom:1rem; }
.c02 article .authName { font-size: 2.0rem; }
.c02 article .corpUrl a { font-size: 1.6rem; }
.c02 article .corpText { font-size: 1.6rem; font-weight: 500; color: #333; margin-top: 2rem; }
.c02 article .btn { background:#32A2D3; width: 70%; }
.c02 .h1Image { width: 300px; height: auto; border: solid 1px #ccc; align-self: start; }

.c02topmv{
    margin-top: 1rem;
    margin-bottom:2rem; 
}
.c02topmv_sp{
    line-height:10px;
    font-size:10px;
}
.c02topmv_name,
.movie_name{ font-size: 2rem; font-weight: 700; color: #000; margin-bottom:1rem;padding-top:2rem; }
.c02topmv_url a,
.movie_url a{ font-size: 1.6rem; font-weight: 500; color: #0C6BB0!important; margin-bottom:1rem; text-decoration: underline; word-break: break-all;}


@media only screen and (max-width:768px){
    .c02 article h3 { font-size: 1.6rem; }
    .c02 h4 { font-size: 1.8rem; }
    .c02 article .corpName { font-size: 1.4rem; }
    .head_corpName { font-size: 1.4rem; }
    .c02 article .authName { font-size: 1.4rem; }
    .c02 article .corpUrl a { font-size: 1.2rem; word-break: break-all; }
    .c02 article .corpText { font-size: 1.4rem;  }
    .c02topmv_name,
    .movie_name { font-size: 1.4rem; }
    .c02topmv_url a{ font-size: 1.2rem; word-break: break-all; }
    .movie_url a{ font-size: 1.2rem; word-break: break-all; }
    
}

/*C03*/
.c03 .pageHeader { background: #0C6BB0; }
.c03 article h3 { color:#0C6BB0; font-size: 2.6rem; font-weight: 700; }
.c03 h4 { background: #0C6BB0; color: #fff; font-size: 2.4rem; font-weight: 700; padding: 1rem; margin: 0 auto 1rem; }
.c03 article .corpName { font-size: 2.0rem; }
.c03 article .authName { font-size: 2.0rem; }
.c03 article .corpUrl a { font-size: 1.6rem; }
.c03 article .corpText { font-size: 1.6rem; font-weight: 500; color: #333; margin-top: 2rem; word-break: break-all; }
.c03 article .posterText { font-size: 2.0rem; font-weight: 500; color: #333; margin-top: 2rem; word-break: break-all; }
.c03 article .btn { background:#0C6BB0; width: 70%; }
.c03 .h1Image { width: 300px; height: auto; border: solid 1px #ccc; align-self: start; }
.c03 article#a04 h4 { background: inherit; border-bottom: solid 2px #0C6BB0; color: #333; font-size: 2.4rem; font-weight: 700; padding: 1rem; margin: 0 auto 1rem; }
.c03 article#a04 h5 { background: #0C6BB0; color: #fff; font-size: 2.4rem; font-weight: 700; padding: 1rem; margin: 0 auto 1rem; position: relative; }
.c03 article#a04 h5 a { color: #fff; font-size: 1.8rem; }
.c03 article#a04 h5 a:after { content: ''; width: 0; height: 0; border-style: solid; border-width: 10px 0 10px 13px; border-color: transparent transparent transparent #fff; position: absolute; top: 50%; right: 1%; margin-top: -10px; }


@media only screen and (max-width:768px){
    .c03 article h3 { font-size: 1.6rem; }
    .c03 h4 {font-size: 1.8rem; }
    .c03 article .corpName { font-size: 1.4rem; }
    .c03 article .authName { font-size: 1.4rem; }
    .c03 article .corpUrl a { font-size: 1.2rem; word-break: break-all; }
    .c03 article .corpText { font-size: 1.4rem; }
    .c03 article .posterText { font-size: 1.4rem; }
    .c03 article#a04 h5 a { padding-right: 3rem; font-size:1.2rem; }

}

/*C04*/
.c04 .pageHeader { background: #8FC31F; }
.c04 article h3 { color:#8FC31F; font-size: 2.6rem; font-weight: 700; }
.c04 h4 { background: #8FC31F; color: #fff; font-size: 2.4rem; font-weight: 700; padding: 1rem; margin: 0 auto 1rem; }
.c04 article .corpName { font-size: 2.0rem; }
.c04 article .authName { font-size: 2.0rem; }
.c04 article .corpUrl a { font-size: 1.6rem; }
.c04 article .corpText { font-size: 1.6rem; font-weight: 500; color: #333; margin-top: 2rem; }
.c04 article .btn { background:#8FC31F; width: 70%; }
.c04 .h1Image { width: 300px; height: auto; border: solid 1px #ccc; align-self: start; }
@media only screen and (max-width:768px){
    .c04 article h3 { font-size: 1.6rem; }
    .c04 h4 { font-size: 1.8rem; }
    .c04 article .corpName { font-size: 1.4rem; }
    .c04 article .authName { font-size: 1.4rem; }
    .c04 article .corpUrl a { font-size: 1.2rem; word-break: break-all; }
    .c04 article .corpText { font-size: 1.2rem; }

}

/*about*/
.about article h3 { color:#333; font-size: 2.6rem; font-weight: 700; text-align: center; }
.about article p { text-indent: 1rem; margin: 6rem auto; width: 50%; line-height: 1.8; }
@media only screen and (max-width:768px){
    .about article p { width: 80%;  }
}

/*inquiry*/
.inquiry article h3 { color:#333; font-size: 2.6rem; font-weight: 700; text-align: center; }
.inquiry article p { margin: 2rem auto; width: 80%; line-height: 1.8; text-align: center; }
@media only screen and (max-width:768px){
    .inquiry article p { width: 80%;  }
}

/*privacy*/
.privacy article h3 { color:#333; font-size: 2.6rem; font-weight: 700; text-align: center; }
.privacy article h4 { width: 60%; color:#333; font-size: 2.2rem; font-weight: 700; border-bottom: solid 1px #ccc; margin: 4rem auto 2rem;  }
.privacy article p { margin: 2rem auto; width: 60%; line-height: 1.8; }
@media only screen and (max-width:768px){
    .privacy article p { width: 80%;  }
}



/*gnavi(layout.css上書き)*/
.spOnly { display: none; }
@media only screen and (max-width:768px){
    .spOnly { display: block; }
}
.gMenu { background: rgba(0,164,221,0.8); }
.gMenu  h1 { width: 80%; display: block; margin: 0 auto 2rem; }
.gMenu ul { border: solid 1px #fff; border-radius: 10px; display: block; padding: 2rem; margin: 3rem auto; }
.gMenu ul li { display: block; padding: 1rem; margin:0.7rem auto; background: #fff; }
.gMenu ul li a { font-size: 1.6rem; font-weight: 700; color:#333; }



/*テキスト頭出し*/

.indent_txt{
    text-indent:-1em;
    margin-left:1em;
}

/*テキスト色・太さ*/

.text_bold{font-weight:bold;}
.text_blue{color:#0C6BB0;}
.centerdiv{text-align: center;}
.posterImage { width: 400px; height: auto; border: solid 1px #ccc; align-self: start;margin-top:2em; }