@charset "UTF-8";
@import url(pcver202107.css?ver=2.0.5);

.sp { display: none }

.orange { background: hsla(17,89%,68%,1.00); }

body { font-size: 1.4rem; }

body.childpage nav { position: sticky; top: 50px; left: 0; height: 0; width: 180px }
body#index nav { position: fixed; top: 50px; left: 50px; height: 0; width: 180px }

nav ul li { margin-bottom: 5px }
nav ul li a {
position: relative;
display: block; 
z-index: 1;
padding: 0 0;
}

nav ul li a::before, 
nav ul li.hit a::before {
background: hsla(0,0%,0%,1);
content: "";
display: block;
width: 25px;
height: 5px;
position: absolute;
left: -33px;
top: 9px;
margin: auto;
}


nav ul li a::before {
transform: scale(0, 1);
transform-origin: right top;
transition: transform .9s;
z-index: -1;
}

nav ul li.hit a::before {
transform: scale(1, 1);
}

nav ul li a:hover::before { transform-origin: right top; transform: scale(1, 1); }

footer,
#container { width: 94%; max-width: 1380px; margin: 0 auto; }
.headerlogo { width: 94%; max-width: 1380px; margin: 50px auto; }
.headerlogo a { display: block; width: 250px; background-color: hsla(0,100%,50%,.0); }
main { padding: 0 0 0 280px; background-color: hsla(0,100%,50%,.0); }
footer {  width: 94%; padding: 50px 3%; }

.h1box { padding: 45vh 0em 45vh 2em ; }
.h1like { font-size: 100px; line-height: 100px; height: 120px; overflow-y: hidden; background-color: hsla(0,100%,50%,.0); }
.h1like span { display: inline; }
h1.indexh1 { font-size: 1.6em; line-height: 1.6em; padding-right: 0; background-color: hsla(0,100%,50%,.0); }
h1.indexh1 span { display: block; padding-right: .0}

.h1child { height: 150px }
body#index .h1child { height: 100px }
.h1child .coco { font-size: 1.0em; line-height: 1.0em; margin: 0px; background-color: hsla(0,100%,50%,.0); }
body#index .h1child .coco { font-size: 2.0em; line-height: 1.0em; }
.h1child h1 { font-size: 2em; line-height: 1.0em; font-weight: normal; background-color: hsla(0,100%,50%,.0); margin: 10px 0 0 0; }

#profile .h1child { height: 100px }
#profile .h1child h1 { margin-left: -3px; }
#profile .txtsmall{ font-size: .6em; padding-left: 5px; vertical-align:3.5px;}

#shingengaku h1 span { font-size: .8em; padding-top: 10px }

.h2box {  }
h2 { padding: 0; margin: 0 }

.h2like { font-size: 2.8em; line-height: 1.1em; }
h2.kamisaloh2 { font-size: 1.3em; line-height: 1.5em; }
h2.kamisaloh2 span { font-size: 1.3em; line-height: 1.5em; }

.headerlogo .coco { font-size: 2em; line-height: 1.2em; }
.headerlogo .mb31 { font-size: 1.2em; letter-spacing: .08em }

.gridbox { background-color: hsla(0,100%,50%,.0) }
.grid { float: left; width: 22%; padding-right: 3%; margin-bottom: 50px; background-color: hsla(0,100%,50%,.0) }

body#index .grid { width: 20%; padding-right: 0; margin-bottom: 30px; }

.gridph { float: left; margin-bottom: 50px; }
.gridtxt { float: right; margin-bottom: 50px; }
.grid.rgt { float: right; }

.messagebox .gridtxt, .messagebox .gridph { width: 48%; }
.messagebox .gridtxt p.fsttxt { font-size: 1.2em; }
.messagebox .gridtxt p.scdtxt { font-size: 1.1em; }
.largebox .gridph { width: 33%; }
.largebox .gridtxt { width: 63%; }
.sign img { padding: 10px 0 0 0 }
#index .sign { width: 28%; padding: 15px 0 0 0% }
#profile .sign { width: 40%; padding: 20px 0 0 0% }

.shingenread p { font-size: 1.4em; }
p.shingenread2 { font-size: 1.1em; line-height: 2em }

.largebox h3 { font-size: 2em; margin: 0; padding: 0 0 20px }
.largebox h3.indexkamisalo { line-height: 1.2em; }
.largebox h3.indexkamisalo span { font-size: .7em; }

.midbox .gridph { float: left; width: 33%; }
.midbox .gridtxt { float: left; width: fit-content;margin-right: 5%; }

.feedbox { width: 70% }

.grid.nidan { width: 45%; }
.grid.sanbunnoni { width: 55%; }
.grid.sandan { width: 30%; }
.grid.radio p { padding-right: 20% }
.grid.intoro { width: 26% }
.grid.intoro p { font-size: 1.2em }
.grid i { padding-right: 6px }
.time { font-size: 1.2em}

body#radio .grid, 
body#mailmagazine .grid 
{ width: 27%; padding-right: 5% }

body#profile .grid { width: 40%; padding-right: 0 }
body#profile .grid.nidan { width: 50%; padding-right: 0 }

body#radio .grid img { width: 95% }

body#books .grid { width: 19%; padding-right: 6%;  }
body#shopping .grid { margin-bottom: 50px }

.sns { margin-top: 30px }
.cw { text-align: center; }

.videopc { width: 80%; padding: 0 0 50px }

#shopping span.faty:nth-child(6) { width: 1.2em;}

a.btreadmore:hover { letter-spacing: .1em; }

#shingengaku .meda { margin-right: 60px; }

/************* anime **************/

.zr1 { animation-delay: 0.3s;}
.zr2 { animation-delay: 0.6s;}
.zr3 { animation-delay: 0.9s;}
.zr4 { animation-delay: 1.2s;}
.zr5 { animation-delay: 1.5s;}
.zr6 { animation-delay: 1.8s;}
.zr7 { animation-delay: 2.1s;}
.zr8 { animation-delay: 2.4s;}
.zr9 { animation-delay: 2.7s;}
.zr10 { animation-delay: 3.0s;}
.zr11 { animation-delay: 3.3s;}
.zr12 { animation-delay: 3.6s;}

.dr1 { animation-duration: 0.5s; }
.dr1 { animation-duration: 1.0s; }
.dr3 { animation-duration: 1.5s; }
.dr4 { animation-duration: 2.0s; }


/********************************************    contact    ******************************************/



#contact { padding: 80px 0 1000px 0; }
dl.toiawase dd{ padding: 0px 10px 10px 10px; margin: 0px 10px 10px 10px; }
dl.toiawase dt{ padding: 10px 10px 0 10px; margin: 0px 10px 10px 10px; }

dl.toiawase dd input.meru{ width: 60%!important; }
dl.toiawase dd input.nama{ width: 40%!important; }
dl.toiawase dd input.pos{ width: 30%!important; }
dl.toiawase dd input.add{ width: 80%!important; }
dl.toiawase dd textarea.you{ width: 90%!important; min-height: 100px!important; }


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


}