/*
Theme Name: Kakuchan
Text Domain: Kakuchan
Version: 1.1
Author: Yuu Yamamoto
Author URI: https://yuuyamamoto.jp
Description: for Kakuchan
*/

/* General */

*{
  box-sizing:border-box;
  word-break:break-all;
  transition:.2s;
}

:root{
	--background:#fdfdfc;
	--body:#222;
	--body-l1:#bbb;
	--body-l2:#ddd;
	--saturday:#118C7C;
	--sunday:#CF4646;
	--svg-link:url('data:image/svg+xml,<svg width="11" height="11" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.999837 0.083313V1.74998H8.15817L0.166504 9.74165L1.3415 10.9166L9.33317 2.92498V10.0833H10.9998V0.083313H0.999837Z" fill="%23AC3535"/></svg>');
	--svg-fa-pencil:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M421.7 220.3l-11.3 11.3-22.6 22.6-205 205c-6.6 6.6-14.8 11.5-23.8 14.1L30.8 511c-8.4 2.5-17.5 .2-23.7-6.1S-1.5 489.7 1 481.2L38.7 353.1c2.6-9 7.5-17.2 14.1-23.8l205-205 22.6-22.6 11.3-11.3 33.9 33.9 62.1 62.1 33.9 33.9zM96 353.9l-9.3 9.3c-.9 .9-1.6 2.1-2 3.4l-25.3 86 86-25.3c1.3-.4 2.5-1.1 3.4-2l9.3-9.3H112c-8.8 0-16-7.2-16-16V353.9zM453.3 19.3l39.4 39.4c25 25 25 65.5 0 90.5l-14.5 14.5-22.6 22.6-11.3 11.3-33.9-33.9-62.1-62.1L314.3 67.7l11.3-11.3 22.6-22.6 14.5-14.5c25-25 65.5-25 90.5 0z"/></svg>');
	--svg-fa-arrow-ip-right:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M288 32c-17.7 0-32 14.3-32 32s14.3 32 32 32h50.7L169.4 265.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L384 141.3V192c0 17.7 14.3 32 32 32s32-14.3 32-32V64c0-17.7-14.3-32-32-32H288zM80 64C35.8 64 0 99.8 0 144V400c0 44.2 35.8 80 80 80H336c44.2 0 80-35.8 80-80V320c0-17.7-14.3-32-32-32s-32 14.3-32 32v80c0 8.8-7.2 16-16 16H80c-8.8 0-16-7.2-16-16V144c0-8.8 7.2-16 16-16h80c17.7 0 32-14.3 32-32s-14.3-32-32-32H80z"/></svg>');
	--svg-twitter:url('data:image/svg+xml;utf8,<svg viewBox="0 0 350 300" xmlns="http://www.w3.org/2000/svg"><path d="M350.001,35.509 C346.026,42.167 340.649,49.197 333.870,56.595 C328.493,62.513 321.944,68.556 314.231,74.720 C314.231,74.720 314.231,76.940 314.231,76.940 C314.231,76.940 314.231,79.530 314.231,79.530 C314.231,80.762 314.346,81.626 314.579,82.119 C314.579,82.119 314.579,84.708 314.579,84.708 C314.579,110.109 310.022,135.572 300.903,161.097 C291.785,186.620 278.809,209.494 261.975,229.715 C243.971,251.417 222.113,268.556 196.394,281.134 C170.674,293.711 141.917,299.999 110.122,299.999 C89.546,299.999 70.142,297.041 51.904,291.122 C33.201,285.202 15.899,276.818 -0.001,265.967 C0.936,266.214 2.337,266.338 4.208,266.338 C7.948,266.831 10.755,267.077 12.626,267.077 C12.626,267.077 17.183,267.077 17.183,267.077 C33.550,267.077 49.567,264.242 65.231,258.569 C79.727,253.144 93.403,245.253 106.263,234.895 C91.300,234.649 77.387,229.469 64.531,219.357 C51.904,209.494 43.486,197.040 39.279,181.997 C42.786,182.737 45.007,183.105 45.943,183.105 C45.943,183.105 49.447,183.105 49.447,183.105 C50.151,183.352 51.202,183.476 52.605,183.476 C54.708,183.476 56.346,183.352 57.516,183.105 C59.853,183.105 63.128,182.612 67.335,181.626 C67.801,181.626 68.505,181.502 69.439,181.256 C70.376,181.009 71.075,180.887 71.542,180.887 C54.941,177.434 41.265,168.679 30.509,154.622 C19.520,140.565 14.029,124.536 14.029,106.534 C14.029,106.534 14.029,106.163 14.029,106.163 C14.029,106.163 14.029,105.794 14.029,105.794 C14.029,105.794 14.029,105.424 14.029,105.424 C18.471,108.383 23.615,110.603 29.460,112.082 C35.538,114.054 41.265,115.042 46.644,115.042 C36.354,107.644 28.640,98.642 23.497,88.038 C17.651,77.187 14.729,65.102 14.729,51.786 C14.729,44.388 15.546,37.729 17.183,31.810 C18.120,27.617 20.457,21.576 24.198,13.685 C42.435,37.358 64.177,55.854 89.429,69.172 C115.382,83.475 142.969,91.366 172.195,92.847 C171.494,87.667 171.145,84.832 171.145,84.339 C170.674,80.886 170.441,78.051 170.441,75.830 C170.441,54.868 177.456,36.989 191.483,22.193 C205.512,7.396 222.462,-0.002 242.337,-0.002 C252.623,-0.002 262.325,2.094 271.444,6.286 C280.562,10.971 288.394,16.891 294.942,24.042 C302.423,22.315 310.372,19.850 318.788,16.644 C325.803,13.931 333.051,10.232 340.532,5.547 C337.729,14.424 333.634,22.439 328.260,29.591 C322.179,36.989 315.751,42.907 308.969,47.347 C315.984,46.113 322.999,44.634 330.010,42.907 C335.388,41.428 342.052,38.961 350.001,35.509 Z"/></svg>');
	--svg-fb:url('data:image/svg+xml;utf8,<svg viewBox="0 0 300 300" xmlns="http://www.w3.org/2000/svg"><path d="M283.000,-0.000 C283.000,-0.000 17.000,-0.000 17.000,-0.000 C7.853,-0.000 -0.000,7.854 -0.000,17.000 C-0.000,17.000 -0.000,283.000 -0.000,283.000 C-0.000,292.144 7.853,300.000 17.000,300.000 C17.000,300.000 161.000,300.000 161.000,300.000 C161.000,300.000 161.000,183.000 161.000,183.000 C161.000,183.000 121.000,183.000 121.000,183.000 C121.000,183.000 121.000,139.000 121.000,139.000 C121.000,139.000 161.000,139.000 161.000,139.000 C161.000,139.000 161.000,105.000 161.000,105.000 C161.000,66.251 183.432,45.000 218.000,45.000 C234.558,45.000 249.852,46.449 254.000,47.000 C254.000,47.000 254.000,88.000 254.000,88.000 C254.000,88.000 229.000,88.000 229.000,88.000 C210.201,88.000 207.000,96.891 207.000,110.000 C207.000,110.000 207.000,139.000 207.000,139.000 C207.000,139.000 252.000,139.000 252.000,139.000 C252.000,139.000 246.000,183.000 246.000,183.000 C246.000,183.000 207.000,183.000 207.000,183.000 C207.000,183.000 207.000,300.000 207.000,300.000 C207.000,300.000 283.000,300.000 283.000,300.000 C292.144,300.000 300.000,292.144 300.000,283.000 C300.000,283.000 300.000,17.000 300.000,17.000 C300.000,7.854 292.144,-0.000 283.000,-0.000 Z"/></svg>');
	--svg-instagram:url('data:image/svg+xml;utf8,<svg viewBox="0 0 503.84 503.84" xmlns="http://www.w3.org/2000/svg"><path d="M256,49.47c67.27,0,75.23.26,101.8,1.47,24.56,1.12,37.9,5.22,46.78,8.67a78,78,0,0,1,29,18.85,78,78,0,0,1,18.85,29c3.45,8.88,7.55,22.22,8.67,46.78,1.21,26.57,1.47,34.53,1.47,101.8s-.26,75.23-1.47,101.8c-1.12,24.56-5.22,37.9-8.67,46.78a83.51,83.51,0,0,1-47.81,47.81c-8.88,3.45-22.22,7.55-46.78,8.67-26.56,1.21-34.53,1.47-101.8,1.47s-75.24-.26-101.8-1.47c-24.56-1.12-37.9-5.22-46.78-8.67a78,78,0,0,1-29-18.85,78,78,0,0,1-18.85-29c-3.45-8.88-7.55-22.22-8.67-46.78-1.21-26.57-1.47-34.53-1.47-101.8s.26-75.23,1.47-101.8c1.12-24.56,5.22-37.9,8.67-46.78a78,78,0,0,1,18.85-29,78,78,0,0,1,29-18.85c8.88-3.45,22.22-7.55,46.78-8.67,26.57-1.21,34.53-1.47,101.8-1.47m0-45.39c-68.42,0-77,.29-103.87,1.52S107,11.08,91,17.3A123.68,123.68,0,0,0,46.36,46.36,123.68,123.68,0,0,0,17.3,91c-6.22,16-10.48,34.34-11.7,61.15S4.08,187.58,4.08,256s.29,77,1.52,103.87S11.08,405,17.3,421a123.68,123.68,0,0,0,29.06,44.62A123.52,123.52,0,0,0,91,494.69c16,6.23,34.34,10.49,61.15,11.71s35.45,1.52,103.87,1.52,77-.29,103.87-1.52S405,500.92,421,494.69A128.74,128.74,0,0,0,494.69,421c6.23-16,10.49-34.34,11.71-61.15s1.52-35.45,1.52-103.87-.29-77-1.52-103.87S500.92,107,494.69,91a123.52,123.52,0,0,0-29.05-44.62A123.68,123.68,0,0,0,421,17.3c-16-6.22-34.34-10.48-61.15-11.7S324.42,4.08,256,4.08Z" transform="translate(-4.08 -4.08)"/><path d="M256,126.64A129.36,129.36,0,1,0,385.36,256,129.35,129.35,0,0,0,256,126.64ZM256,340a84,84,0,1,1,84-84A84,84,0,0,1,256,340Z" transform="translate(-4.08 -4.08)"/><circle cx="386.4" cy="117.44" r="30.23"/></svg>');
}

input,button,select,textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  border-radius: 0;
  font: inherit;
  outline: none;
  cursor: pointer;
}
input[type='checkbox'],input[type='radio'] {
  display: none;
}
select::-ms-expand {
	display: none;
}
textarea {
  resize: vertical;
}
ol, ul {
	list-style-type:none;
	margin:0;
	padding-left:0;
}
a{
	color:inherit;
	text-decoration:none;
	-webkit-animation:blink 1.0s ease-out infinite alternate;
    -moz-animation:blink 1.0s ease-out infinite alternate;
    animation:blink 1.0s ease-out infinite alternate;
}
@-webkit-keyframes blink{
    0% {opacity:.2;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:.2;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:.2;}
    100% {opacity:1;}
}
figure{
	max-width:100%;
	margin:0;
}
img{
	width:100%;
	height:auto;
	vertical-align: bottom;
}

/* Type & Color Collection */

body{
	font-family:'Josefin Sans', system-ui, sans-serif;
	font-weight:600;
	width:100%;
	background-color:var(--background);
	color:var(--body);
	line-height:1.75;
}

.zen{
	font-family:'Zen Kaku Gothic New', system-ui, sans-serif;;
	font-size:1em;
}

h1{
	font-size:2.2em;
	font-weight:600;
	line-height:1;
}

.invert{
	background-color:var(--body);
	color:var(--background);
}
.saturday{
	color:var(--saturday);
}
.saturday.invert{
	background-color:var(--saturday);
	color:var(--body);
}
.sunday{
	color:var(--sunday);

}
.sunday.invert{
	background-color:var(--sunday);
	color:var(--body);
}

/* Layout */

html{
	margin:0;
	height: 100%;
    max-height: 100%;
}
body{
	margin:0;
	display:flex;
	flex-direction:column;
	align-items: center;
}
header{
	width:100%;
	padding:24px 0 24px 0;
	display:flex;
	flex-direction:column;
	align-items: center;
}
main{
	width:100%;
	padding-bottom:60px;
	display:flex;
	flex-direction:column;
	align-items: center;
  }
.mw480{
	width:100%;
	max-width:480px;
}

/* Layout Header */

header>*{
	width:100%;
	max-width:480px;
	padding:0 20px;
}
header>h1{
	margin-left:-0.16em;
}
nav{
	display:flex;
	gap:12px;
}
label{
	margin:0;
	font-size:1.2em;
	line-height:1.1;
	color:var(--body-l1);
	border-bottom:solid 2px var(--body-l2);
	cursor:pointer;
}
input[type='radio']:checked+label{
	color:var(--body);
	border-bottom:solid 2px;
	opacity:1;
}

/* Live Schedule */

.live{
	width:100%;
	max-width:480px;
	padding:0 20px;
}
.live li{
	display:flex;
	flex-direction:column;
	align-items:center;
	width:100%;
	margin:40px auto 0 auto;
}
.live li:first-child{
	margin-top:20px;
}
.live li *{
	margin:0;
}
.live .display{
	display:flex;
	justify-content:center;
	align-items:center;
	line-height:1;
}
.live .display .month{
	text-align:right;
	font-size:3.5em;
	padding-bottom:40px;
	padding-right:4px;
}
.live .display .period{
	border-left:7px solid;
	height:64px;
	transform: rotate(30deg);
	margin:0 20px 0 16px;
	font-size:0;
}
.live .display .date{
	text-align:left;
	font-size:5em;
	font-weight:400;
	padding-top:40px;
	padding-left:4px;
}
.live .day .comma{
	font-size:0;
}
.live .day .day{
	font-size:1.75em;
	font-weight:600;
	letter-spacing: 0.05em;
	line-height:1.25;
}
.live .divider {
	display:flex;
    justify-content:end;
    align-items:end;
	width:100%;
	height:28px;
	border-bottom:2px solid;
}
.live .divider .link{
	display:flex;
	text-align:right;
	font-size:1em;
	font-weight:600;
	line-height:2;
	letter-spacing: 0.05em;
	margin-bottom:-.2em;
}
.live .divider i{
	display:inline-block;
	border-bottom:1em solid;
	-webkit-mask:var(--svg-link);
	mask:var(--svg-link);
	-webkit-mask-size:contain;
	mask-size:contain;
	-webkit-mask-repeat:no-repeat;
	mask-repeat:no-repeat;
	-webkit-mask-position: bottom;
	mask-position: bottom;
	width:12px;
	margin-left:4px;
	pointer-events: auto;
}
.live .detail {
	margin-top:4px;
	width:100%;
}
.live .detail .date{
	line-height: 1.75;
	text-align: right;
	font-size:.75em;
}
.live .detail .title{
	text-align: left;
	font-size:1em;
	line-height:1.5;
	margin-top:.5rem;
}
.live .detail .body{
	text-align: left;
	font-size:.75em;
	margin-top:.25rem;
}

/* News */

.news{
	width:100%;
	max-width:480px;
	padding:0 20px;
}
.news li{
	display:flex;
	flex-direction:column;
	align-items:center;
	width:100%;
	margin:40px auto 0 auto;
}
.news li *{
	margin:0;
}
.news li:first-child{
	margin-top:20px;
}
.news .category{
	width:100%;
	font-size:1.2em;
	line-height:2;
}
.news .display{
	display:flex;
	justify-content:center;
	align-items:center;
	line-height:1;
	width:100%;
}
.news .display .month{
	text-align:right;
	font-size:2em;
	padding-bottom:12px;
	margin-right:-8px;
}
.news .display .date{
	text-align:left;
	font-size:2.2em;
	font-weight:400;
	padding-top:12px;
	margin-left:-10px;
}
.news .display .hyphen{
	border-left:3px solid;
	height:20px;
	transform: rotate(90deg);
	margin:0 20px;
	font-size:0;
}
.news .display .period{
	border-left:3px solid;
	height:36px;
	transform: rotate(30deg);
	margin:0 20px 0 16px;
	font-size:0;
}
.news .display .divider{
	display:flex;
    justify-content:end;
    align-items:end;
	margin-left:1em;
	flex:1;
	height:28px;
	border-bottom:2px solid;
}
.news .divider .link{
	display:flex;
	text-align:right;
	font-size:1em;
	font-weight:600;
	line-height:2;
	letter-spacing: 0.05em;
	margin-bottom:-.2em;
}
.news .divider i{
	display:inline-block;
	border-bottom:1em solid;
	-webkit-mask:var(--svg-link);
	mask:var(--svg-link);
	-webkit-mask-size:contain;
	mask-size:contain;
	-webkit-mask-repeat:no-repeat;
	mask-repeat:no-repeat;
	-webkit-mask-position: bottom;
	mask-position: bottom;
	width:12px;
	margin-left:4px;
	pointer-events: auto;
}
.news .detail {
	margin-top:2px;
	width:100%;
}
.news .detail .date{
	line-height: 1.75;
	text-align: right;
	font-size:.6em;
}
.news .detail .title{
	text-align: left;
	font-size:1em;
	line-height:1.5;
	margin-top:.5rem;
}
.news .detail .body{
	text-align: left;
	font-size:.75em;
	margin-top:.25rem;
}

/* Listen */

.listen{
	width:100%;
	max-width:480px;
	padding:0 20px;
}
.listen li{
	display:flex;
	flex-direction:column;
	align-items:center;
	width:100%;
	margin:40px auto 0 auto;
}

/* [Section Title] */