@charset "UTF-8";





/* base

----------------------------------------- */

article {

margin-bottom: 0!important;

overflow-x: hidden;



font-family: "ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ","Meiryo","ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;

font-weight: 200;

}



#mainLogo {

margin-top: 1.5em;

}





/* section h2〜

----------------------------------------- */

section header {

margin-bottom: 2em;

width: 100%;

display: table;

position: relative;

z-index: 100;

}

section h2 {

font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;

}

section h2 .ja {

width: 100%;

display: block;

letter-spacing: 0.5em;

}

section h2 .en {

display: block;

}



/* section

----------------------------------------- */

section {

padding-bottom: 2em;

width: 100%;

}

section:last-child {

margin-bottom: 0;

}

section > .wrap {

margin: 0 auto;

margin-bottom: 3em;

display: table;

}

section:nth-child(odd) {

background: #8e1201;

}

section:nth-child(even) {

background: #595757;

}

section:nth-child(odd) header {

background: -moz-linear-gradient(left, rgba(142,18,1,1) 50%, rgba(89,87,87,1) 50%);

background: -webkit-linear-gradient(left, rgba(142,18,1,1) 50%,rgba(89,87,87,1) 50%);

background: linear-gradient(to right, rgba(142,18,1,1) 50%,rgba(89,87,87,1) 50%);

}

section:nth-child(even) header {

background: -moz-linear-gradient(left, rgba(89,87,87,1) 50%, rgba(142,18,1,1) 50%);

background: -webkit-linear-gradient(left, rgba(89,87,87,1) 50%, rgba(142,18,1,1) 50%);

background: linear-gradient(to right, rgba(89,87,87,1) 50%, rgba(142,18,1,1) 50%);

}

section h2 {

margin: 0 auto;

width: 100%;

min-height: 70px;

display: table;

position: relative;

font-weight: 200;

}

section h2 span {

color: #efefef;

}

section:first-of-type header::before {

content: "";

width: 100%;

height: 50px;

position: absolute;

top: 0;

left: 0;

background: -moz-linear-gradient(top, rgba(31,32,32,0.5) 0%, rgba(89,87,87,0) 100%);

background: -webkit-linear-gradient(top, rgba(31,32,32,0.5) 0%,rgba(89,87,87,0) 100%);

background: linear-gradient(to bottom, rgba(31,32,32,0.5) 0%,rgba(89,87,87,0) 100%);

}

section header::after {

content: "";

width: 100%;

position: absolute;

right: 0;

bottom: 0;

height: 5px;

background: -moz-linear-gradient(left, rgba(252,248,240,0) 50%, rgba(252,248,239,1) 51%, rgba(246,224,182,1) 100%);

background: -webkit-linear-gradient(left, rgba(252,248,240,0) 50%,rgba(252,248,239,1) 51%,rgba(246,224,182,1) 100%);

background: linear-gradient(to right, rgba(252,248,240,0) 50%,rgba(252,248,239,1) 51%,rgba(246,224,182,1) 100%);

}

section h2 .num {

width: 10%;

display: table-cell;

position: relative;

-webkit-transform: skewX(-135deg);

-moz-transform: skewX(-135deg);

transform: skewX(-135deg);

z-index: 9999;

}

section h2 .num::after {

content: "";

position: absolute;

top: 0;

right: 0;

width: 22px;

height: 100%;

background: -moz-linear-gradient(top, rgba(163,26,11,1) 0%, rgba(209,41,26,1) 100%);

background: -webkit-linear-gradient(top, rgba(163,26,11,1) 0%,rgba(209,41,26,1) 100%);

background: linear-gradient(to bottom, rgba(163,26,11,1) 0%,rgba(209,41,26,1) 100%);

z-index: -20;

}

section h2 .num span {

line-height: 1;

display: block;

position: absolute;

top: 0;

left: 50%;

font-family: 'ヒラギノ角ゴシック W0', 'Hiragino Kaku Gothic Pro W0', 'HiraKakuPro-W0' , sans-serif;

font-weight: normal;

font-style: normal;

text-shadow: 3px 3px 0 rgba(35,24,21,0.7);

-webkit-transform: skewX(135deg);

-moz-transform: skewX(135deg);

transform: skewX(135deg);

}

section h2 .wrap {

display: table-cell;

width: 90%;

-webkit-transform: skewX(-135deg);

-moz-transform: skewX(-135deg);

transform: skewX(-135deg);

background: #595757;

}

section:nth-child(odd) h2 .wrap {

background: #595757;

}

section:nth-child(even) h2 .wrap {

background: #8e1201;

}

section:first-of-type h2 .wrap::before {

content: "";

width: 100%;

height: 50px;

position: absolute;

top: 0;

left: 0;

background: -moz-linear-gradient(top, rgba(31,32,32,0.5) 0%, rgba(89,87,87,0) 100%);

background: -webkit-linear-gradient(top, rgba(31,32,32,0.5) 0%,rgba(89,87,87,0) 100%);

background: linear-gradient(to bottom, rgba(31,32,32,0.5) 0%,rgba(89,87,87,0) 100%);

}

section h2 .wrap::after {

content: "";

width: 100%;

position: absolute;

right: 0;

bottom: 0;

height: 5px;

background: -moz-linear-gradient(left, rgba(247,226,179,1) 0%, rgba(252,248,240,1) 100%);

background: -webkit-linear-gradient(left, rgba(247,226,179,1) 0%,rgba(252,248,240,1) 100%);

background: linear-gradient(to right, rgba(247,226,179,1) 0%,rgba(252,248,240,1) 100%);

}

section h2 .wrap .ja {

display: block;

position: relative;

left: 15%;

text-shadow: 3px 3px 0 rgba(35,24,21,0.7);

-webkit-transform: skewX(135deg);

-moz-transform: skewX(135deg);

transform: skewX(135deg);

}

section .wrap .img {

vertical-align: top;

}

section .wrap .img img {

display: inline-block;

vertical-align: top;

}

section .wrap .comment {

color: #efefef;

font-weight: 200;

}

section .wrap .comment h3 {

margin-bottom: 1em;

font-size: 1.5rem;

font-weight: 200;

}

section .wrap .comment h3 span {

font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;

border-bottom: 2px dotted #efefef;

}



/* Section Content Main Position

----------------------------------------- */

section .detail {

width: 100%;

display: inline-block;

}

section .detail li {

margin-bottom: 5em;

vertical-align: top;

}





/* Alert

----------------------------------------- */

#Alert .widget {

width: 100%;

display: inline-block;

background: -moz-linear-gradient(top, rgba(230,230,230,1) 0%, rgba(255,255,255,1) 10%);

background: -webkit-linear-gradient(top, rgba(230,230,230,1) 0%,rgba(255,255,255,1) 10%);

background: linear-gradient(to bottom, rgba(230,230,230,1) 0%,rgba(255,255,255,1) 10%);

}

#Alert .widgetWrap {

margin: 4em auto;

}

#Alert h2 {

margin-bottom: 1em;

border-bottom: 1px solid #595757;

}

#Alert .alertWrap {

margin: 0 auto 4em auto;

}

#Alert .term {

margin: 1em 0;

font-size: 1.3rem;

}

#Alert:empty + .widget-area  {

display: none;

}



/* NewsList

----------------------------------------- */

#NewsList {

width: 100%;

display: inline-block;

background: -moz-linear-gradient(top, rgba(230,230,230,1) 0%, rgba(255,255,255,1) 10%);

background: -webkit-linear-gradient(top, rgba(230,230,230,1) 0%,rgba(255,255,255,1) 10%);

background: linear-gradient(to bottom, rgba(230,230,230,1) 0%,rgba(255,255,255,1) 10%);

border-bottom: 5px solid #595757;

}

#NewsList h2 {

width: 100%;

display: inline-block;

}

#NewsList > h2 span {

margin: 1em auto 1em auto;

display: block;

}

#NewsList .postList {

margin: 0 auto 5em auto;

display: block;

}

#NewsList .postListWrap {

width: 100%;

display: table;

border-bottom: 2px solid rgba(89,87,87,1);

}

#NewsList .postListWrap:nth-last-of-type(n+2) {

margin-bottom: 1em;

}



#NewsList .postList .time {

margin-bottom: 0.5em;

}



#NewsList .postList .detail .headerWrap {

padding-bottom: 0.5em;

}



#NewsList .postList .date {

text-align: right;

}

#NewsList .postList .date li {

display: inline-block;

}

#NewsList .postList .date li a {

padding-top: 0.3em;

padding-right: 1em;

padding-bottom: 0.1em;

padding-left: 1em;

display: block;

color: #ffffff;

font-size: 0.8rem;

font-weight: bold;

background: rgba(89,87,87,1);

}

#NewsList .postList .date .tag a {

background: #8e1201;

color: #ffffff;

}

#NewsList .postList .date .tag a:hover {

background: rgba(142,18,1,0.8);

}

#NewsList .postList .date li a:hover {

background: rgba(89,87,87,0.8);

-moz-transition: all .3s;

-webkit-transition: all .3s;

transition: all .3s;

text-decoration: none;

}

#NewsList .postList .date li:nth-of-type(n+2) {

margin-left: 1em;

}





/* PR song

----------------------------------------- */

#PRsong {

margin-bottom: 5em;

display: block;

}

#PRsong h2 {

position: relative;

background: rgba(252,248,239,1);

border: 2px solid rgba(142,18,1,1);

border-radius: 10px;

text-align: center;

}

#PRsong h2 > span {

padding-top: 1em;

padding-bottom: 1em;

display: block;

}

#PRsong h2 span > span {

display: block;

color: rgba(142,18,1,1);

}

#PRsong .prayer audio {

border-top: 2px solid rgba(252,248,239,1);

border-right: 2px solid rgba(89,87,87,1);

border-bottom: 2px solid rgba(89,87,87,1);

border-left: 2px solid rgba(252,248,239,1);

border-radius: 100px;

outline: none;

}



/* 

TV movie

----------------------------------------- */

#TVmovie {

margin-bottom: 3em;

}

#TVmovie h2 {

margin-bottom: 1.5em;

position: relative;

background: rgba(252,248,239,1);

border: 2px solid rgba(142,18,1,1);

border-radius: 10px;

text-align: center;

}

#TVmovie h2 > span {

padding: 1em;

display: block;

}

#TVmovie h2 span > span {

color: rgba(142,18,1,1);

}



#TVmovie video {

box-shadow: 0 5px 5px rgb(51 51 51 / 50%);

}



/* 

CM movie

----------------------------------------- */

#CMmovie {

margin-bottom: 5em;

}

#CMmovie h2 {

text-align: center;

}

#CMmovie h2 span > span {

color: rgba(142,18,1,1);

}

#CMmovie iframe {

margin: auto;

display: block;

box-shadow: 0 5px 5px rgba(51,51,51,0.5);

}







/* KabutoyaLink

----------------------------------------- */

#KabutoyaLink {

margin-bottom: 5em;

display: block;

}







/* -------------------------------------------



 PC向け表示設定

 

============================================== */

@media only screen and (min-width: 900px){





/* -------------------------------------------



Section Content Main Position

============================================== */

section > .wrap {

width: 900px;

}

section h2 {

width: 900px;

}

section .detail li h3 span {

display: inline-block;

}

section .detail li h3 .num {

width: 4em;

text-align: center;

}

section .detail li {

width: 440px;

display: inline-block;

}

section .detail li img {

width: 440px;

height: 260px;

}

section .detail li:nth-child(2n) {

margin-left: 13px;

}

section .detail li:nth-last-child(-n+2), 

section .detail li:last-child {

margin-bottom: 0;

}

section h2 {

min-height: 137px;

}

section h2 .wrap .en {

display: block;

width: 85%;

position: absolute;

left: 8%;

bottom: 10%;

text-shadow: 2px 2px 0 rgba(35,24,21,0.7);

-webkit-transform: skewX(135deg);

-moz-transform: skewX(135deg);

transform: skewX(135deg);

}

section h2 .en::before {

content: "";

display: block;

width: 227px;

height: 27px;

position: absolute;

right: 0;

bottom: 5%;

background: url(../images/logo_eng.png) no-repeat;

}

section h2 .num {

font-size: 7.5rem;

text-align: center;

line-height: 1;

}

section h2 .ja {

font-size: 4rem;

}

section h2 .en {

font-size: 1rem;

}

section .wrap .img {

width: 450px;

display: table-cell;

}

section .wrap .comment {

display: table-cell;

}

section .wrap .comment p {

letter-spacing: 0;

text-align: justify;

}



section .wrap .comment h3 span {

display: block;

}



/* -------------------------------------------

Alert

============================================== */

#Alert .widgetWrap {

width: 900px;

}

#Alert .alertWrap {

width: 900px;

}





/* -------------------------------------------

News List

============================================== */



#NewsList .postList {

width: 900px;

}

#NewsList .postList .time {

width: 20%;

display: table-cell;

}

#NewsList > h2:first-of-type span {

width: 900px;

}

#NewsList .postList .detail {

display: table-cell;

}







/* -------------------------------------------

PR song CM movie

============================================== */

.widget-area-3 {

margin-right: auto;

margin-left: auto;

width: 900px;

display: table;

}

.widget-area-3 > .widget {

width: 50%;

display: table-cell;

vertical-align: top;

}





/* -------------------------------------------

PR song

============================================== */

#PRsong {

margin-bottom: 5em;

display: block;

}

#PRsong .wrap {

margin-right: auto;

margin-left: auto;

width: 100%;

overflow: hidden;

padding: 1.5em;

}

#PRsong h2 {

margin-bottom: 2em;

font-size: 130%;

}

#PRsong h2::before,

#PRsong h2::after {

content: "";

position: absolute;

top: 100%;

left: 50%;

}

#PRsong h2::before {

margin-left: -12.82px;

border: 12.82px solid transparent;

border-top: 12.82px solid rgba(142,18,1,1);

z-index: 1;

}

#PRsong h2::after {

margin-left: -10px;

border: 10px solid transparent;

border-top: 10px solid rgba(252,248,239,1);

z-index: 2;

}

#PRsong h2 span > span {

font-size: 120%;

}

#PRsong .prayer {

vertical-align: middle;

padding-left: 3em;

}

#PRsong .prayer audio {

width: 90%;

}





/* -------------------------------------------

TV movie

============================================== */

#TVmovie {

margin-right: auto;

margin-left: auto;

width: 900px;

display: block;

}

#TVmovie h2 span {

font-size: 130%;

}

#TVmovie h2 span > span {

font-size: 100%;

}

#TVmovie h2::before,

#TVmovie h2::after {

content: "";

position: absolute;

top: 100%;

left: 50%;

}

#TVmovie h2::before {

margin-left: -12.82px;

border: 12.82px solid transparent;

border-top: 12.82px solid rgba(142,18,1,1);

z-index: 1;

}

#TVmovie h2::after {

margin-left: -10px;

border: 10px solid transparent;

border-top: 10px solid rgba(252,248,239,1);

z-index: 2;

}

#TVmovie video {

margin: auto;

width: 75%;

display: block;

}











/* -------------------------------------------

CM movie

============================================== */

#CMmovie h2 {

font-size: 130%;

}

#CMmovie h2 span > span {

font-size: 120%;

}





/* -------------------------------------------

Kabutoya banner link

============================================== */

#KabutoyaLink .wrap {

margin-right: auto;

margin-left: auto;

width: 900px;

overflow: hidden;

}









}/* end */

/* 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

PC以外向け表示設定

 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜 */

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



#main {

width: 100%;

}



#mainLogo > span {

margin-bottom: 0.3em;

font-weight: bold;

font-size: 0.8rem;

}







/* 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

section

 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜 */

section > .wrap {

width: 96%;

}

section h2 .num {

font-size: 12vw;

}

section h2 .num::after {

width: 12px;

}

section h2 .ja {

font-size: 8vw;

}

section h2 .wrap .en {

display: none;

width: 85%;

position: absolute;

left: 8%;

bottom: 15%;

font-size: 0.3em;

text-shadow: 2px 2px 0 rgba(35,24,21,0.7);

-webkit-transform: skewX(135deg);

-moz-transform: skewX(135deg);

transform: skewX(135deg);

}

section .detail li h3 span {

display: block;

text-align: center;

}

section .detail li img {

width: 100%;

height: 260px;

}

section .wrap .img {

margin-bottom: 1em;

display: block;

text-align: center;

}

section .wrap .img img {

width: 90%;

}

section .wrap .comment h3 {

text-align: justify;

}



/* 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

News List

 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜 */

#NewsList .postList {

margin-right: auto;

margin-left: auto;

width: 90%;

}

#NewsList .postList .time {

display: block;

}

#NewsList > h2:first-of-type span {

width: 90%;

}

#NewsList .postList .detail {

display: block;

}





/* 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

PR song

〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜 */

#PRsong .wrap {

margin-right: auto;

margin-left: auto;

width: 90%;

text-align: center;

}

#PRsong h2 {

margin-bottom: 2em;

font-size: 130%;

}

#PRsong h2::before,

#PRsong h2::after {

content: "";

position: absolute;

top: 100%;

left: 50%;

}

#PRsong h2::before {

margin-left: -12.82px;

border: 12.82px solid transparent;

border-top: 12.82px solid rgba(142,18,1,1);

z-index: 1;

}

#PRsong h2::after {

margin-left: -10px;

border: 10px solid transparent;

border-top: 10px solid rgba(252,248,239,1);

z-index: 2;

}

#PRsong audio {

width: 90%;

}





/* 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

TV movie

〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜 */

#TVmovie .wrap {

margin-right: auto;

margin-left: auto;

width: 90%;

text-align: center;

}

#TVmovie h2::before,

#TVmovie h2::after {

content: "";

position: absolute;

top: 100%;

left: 50%;

}

#TVmovie h2::before {

margin-left: -12.82px;

border: 12.82px solid transparent;

border-top: 12.82px solid rgba(142,18,1,1);

z-index: 1;

}

#TVmovie h2::after {

margin-left: -10px;

border: 10px solid transparent;

border-top: 10px solid rgba(252,248,239,1);

z-index: 2;

}



#TVmovie video {

margin: auto;

width: 90%;

display: block;

}





/* 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

CM movie

〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜 */

#CMmovie h2 {

margin-bottom: 1em;

font-size: 130%;

}

#CMmovie iframe {

margin: auto;

width: 90%;

display: block;

}





/* 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

Kabutota banner link

〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜 */

#KabutoyaLink .wrap {

margin-right: auto;

margin-left: auto;

width: 90%;

text-align: center;

}









}/* end */