@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=BIZ+UDPGothic&family=Darumadrop+One&family=Noto+Sans+JP:wght@100..900&display=swap');

*,::before,::after{box-sizing:border-box}::before,::after{text-decoration:inherit;vertical-align:inherit}html{cursor:auto;line-height:1.5;-moz-tab-size:2;tab-size:2;-webkit-tap-highlight-color:transparent;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;word-break:break-word;font-size:62.5%;margin:0;padding:0}body{margin:0;padding:0;-webkit-text-size-adjust:100%}h1,h2,h3,h4,h5,h6{margin:0}dl dl,dl ol,dl ul,ol dl,ul dl{margin:0;padding:0}ol ol,ol ul,ul ol,ul ul{margin:0;padding:0}hr{height:0;overflow:visible}main{display:block}ol,ul{list-style:none;padding:0;margin:0}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;text-decoration:none}h1,h2,h3,h4,h5,h6{margin:0;padding:0}p{padding:0;margin:0}abbr[title]{text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}audio,canvas,iframe,img,svg,video{vertical-align:middle}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}iframe{border-style:none}img{border-style:none}svg:not([fill]){fill:currentColor}svg:not(:root){overflow:hidden}table{border-collapse:collapse}button,input,select{margin:0}button{overflow:visible;text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}fieldset{border:1px solid #a0a0a0;padding:.35em .75em .625em}input{overflow:visible}legend{color:inherit;display:table;max-width:100%;white-space:normal}progress{display:inline-block;vertical-align:baseline}select{text-transform:none}textarea{margin:0;overflow:auto;resize:vertical}[type="checkbox"],[type="radio"]{padding:0}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}details{display:block}dialog{background-color:#fff;border:solid;color:#000;display:block;height:-moz-fit-content;height:-webkit-fit-content;height:fit-content;left:0;margin:auto;padding:1em;position:absolute;right:0;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}dialog:not([open]){display:none}summary{display:list-item}canvas{display:inline-block}template{display:none}a,area,button,input,label,select,summary,textarea,[tabindex]{-ms-touch-action:manipulation;touch-action:manipulation}[hidden]{display:none}[aria-busy="true"]{cursor:progress}[aria-controls]{cursor:pointer}[aria-disabled="true"],[disabled]{cursor:not-allowed}[aria-hidden="false"][hidden]{display:initial}[aria-hidden="false"][hidden]:not(:focus){clip:rect(0,0,0,0);position:absolute}address{font-style:normal}figure{margin:0}h1,h2,h3,h4,h5,h6{margin:0;font-size:1.6rem;}a{color: #000;}img{max-width:100%;height:auto;}.bold{font-weight:bold;}

/* カスタムプロパティ */
:root {
  --font-jp: 'BIZ UDPGothic';
  --font-num: 'Darumadrop One';
  --red: #ed1c2a;
  --blue: #47c3c8;
}
a:hover{opacity:.7;}
/* ページ内リンクの移動を滑らかに */
html {scroll-behavior: smooth;}
/* 基本設定 */
body {
  -webkit-text-size-adjust: 100%;
  font-size: 1.6rem;
  line-height: 2;
  letter-spacing: 0px;
  font-family: var(--font-jp);
  font-weight: 500;
  overflow-x: hidden;
}
.font_num{font-family: var(--font-num);}
.red{color:var(--red);}
.blue{color:var(--blue)}
.white{color:#fff;}

.pc_block {display: block;}
.sp_block {display: none;}
:target::before{
  content: '';
  margin-top: -60px;
  height: 60px;
  display: block;
  visibility: hidden;
}
.center{text-align:center;}

@media screen and (max-width: 1279px) {
  body {
    width: 1280px;
  }
}
@media screen and (max-width: 767px) {
  body {
    width: 100%;
    font-size: 1.4rem;
  }
  .pc_block {display: none;}
  .sp_block {display: block;}
}
/* アニメーション
======================================================= */

.fade{
  opacity: .5;
  transition: .5s ease-in-out;
}
.fade.fade--bot{
  transform: translate(0,100px);
}
.fade.fadein{
  transform: translate(0,0);
  opacity: 1;
}

/* ==========================
header
============================= */

header {
  position: fixed;
  width: 100%;
  height: 90px;
  top: 0;
  z-index: 9999;
  transition: all .5s;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 1279px) {
  header {
    width: 1280px;
  }
}
.h_logo{
  width: 240px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  top: 7rem;
}

.hd_right{
  background: rgba(0, 0, 0, 0.75);
  width: calc(100% - 240px);
  height: 100%;
  padding-left: 3.2rem;
  overflow: hidden;
  position: relative;

  .hd_com{
    width: 385px;
    display: flex;
    align-items: start;
    line-height: 1;
    gap: 1rem;
    position: absolute;
    top: 0rem;
    right: 14rem;

    a{
      padding-top: 1.5rem;
    }
  }
}

.hd_time{
  font-size: 2.4rem;
  font-weight: 700;
  letter-spacing: .24rem;
  line-height: 1.4;
  position: relative;

  & span{
    font-size: 5.6rem;
    font-weight: 400;
    font-family: 'Darumadrop One';
  }
}
.hd_image{
  width: 145px;
  height: 128px;
  position: absolute;
  top: 0;
  right: 1.3rem;

  & span{
    position: absolute;

    &:nth-child(1){
      left: 0;
      bottom: 1.5rem;
    }
    &:nth-child(2){
      right: 0;
      top: 0rem;
    }
    &:nth-child(3){
      right: 0;
      bottom: 0rem;
    }
  }

}

@media screen and (max-width: 767px){
  header {
    width: 100%;
  }
  .h_logo{
    width: 97px;
    padding: 0 1rem;
    position: static;
  }
  .hd_right{
    width: calc(100% - 97px);
    padding-left: 1rem;
    

  .hd_com{
    position: absolute;
    top: auto;
    bottom: -1rem;
    right: 0rem;
    gap: 0;
    justify-content: end;
    
    a{
      padding-top: 1rem;
    }

    .tamasaburou{
      width: 70px;
      position: relative;
      top: 1rem;
    }
    img{
      width: 150px;
    }
  }

  }

  .hd_time{
    font-size: 1.6rem;
    line-height: 1.2;
    top: 0rem;

    & span{
      font-size: 2.4rem;
    }
  }

  .hd_image{
    width: 49px;
    height: 37px;
    right: 0;

    & span{
      &:nth-child(4){
        right: 0;
        top: 0rem;
      }
    }
  }
}
@media screen and (max-width: 350px){
  .hd_image{
    display: none;
  }
  .hd_time{
    font-size: 1.4rem;
  }
}

/* ==========================
footer
============================= */
.ft_img{
    width: 100%;
    margin-top: -23rem;
    padding: 2rem 0 0;
    position: relative;
  img{
    width: 100%;
  }
}
.ft_po p{
  position: absolute;
  top: 0;
  left: 0;
}

.ft_po p {
  display: inline-block;
  transform-origin: center center;
}
.ft_po p.pc_block{
  display: none;
}


.copyright{
  background: #6273c1;
  color: #fff;
  font-size: 1.6rem;
  font-weight: 400;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: "Noto Sans JP";
  text-align: center;
}
@media screen and (max-width: 767px){
  .ft_img{
    margin-top: -16rem;
    padding-bottom: 1rem;
  }
  .copyright{
    height: 50px;
    padding: 0 3%;
    line-height: 1.3;
  }

  .ft_po p.pc_block{
    display: inline-block;
  }
}

/*back_top*/
#page_top {
  width: 80px;
  height: 84px;
  position: fixed;
  bottom: -200px;
  opacity: 1;
  right: calc(4% + 14px);
  z-index: 40;
  background: url("../img/page_top.svg") no-repeat center;
  -webkit-background-size: contain;
  background-size: contain;
  border-radius: 50%;
  transition: .5s;
}
#page_top.active {
  bottom: 40px;
}
#page_top a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}



/* 印刷用設定 */
@media print {
  body{width:1280px;zoom:0.68;-webkit-print-color-adjust:exact;}
  header{position: absolute;}
}
@page {size:A4;margin:5px;}
