@charset "utf-8";
/* CSS Document */
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@100;300;400;500;700;900&display=swap");
html {
  font-family: "游明朝体", "Yu Mincho", YuMincho,"Noto Serif JP", serif;
}

/* -----------------------------------------------------------
	common
------------------------------------------------------------*/
html,body {
height:100%;
margin:0;
}
html {
font-family: sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
body {
font-weight: 500;
color:#333;
line-height:1.8;
-webkit-text-size-adjust: 100%;
-webkit-font-smoothing: antialiased;
-webkit-overflow-scrolling: touch;
}

/* ゴシック系 */
body, table, th, td, p, li, dt, dd, div, span,.go {
  font-family: "Noto Serif JP", serif;
}

h1,h2,h3,h4,h5 {
line-height: 1.4;
font-weight:bold;
}

* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

h1,h2,h3,h4,h5 {
margin:0;
}
p,li,dt,dd,th,td,div,span,em {
color: #444;
line-height: 1.8;
word-wrap: break-word;
margin-top:0;
}
li {
line-height: 1.4;
list-style: none;
}
ul,ol {
padding-left:0;
margin:0;
}
dl,dt,dd {
  margin-left:0;
}
table {
width: 100%;
border-collapse: collapse;
}
a {
  word-break: break-word;
  color:#000;
}
a:hover {
  color:#333;
}
#header a:hover, #footer a:hover {
  text-decoration: none;
}

@media screen and ( min-width: 751px ){
  a {
  -webkit-transition: background  0.3s ease, color 0.3s ease;
  -moz-transition: background  0.3s ease, color 0.3s ease;
  -o-transition: background  0.3s ease, color 0.3s ease;
  transition: background  0.3s ease, color 0.3s ease;
}
	a:hover {
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
	opacity: 0.7;
	cursor:pointer;
  transition:opacity 0.3s;
  text-decoration: none;
	}
	a:hover img {
	-ms-filter: "alpha(opacity=70)";
	filter: alpha(opacity=70);
	}
	#page-top a:hover {
  text-decoration: none;
  opacity: 0.7;
	}

  /* タブレット、PC751以上 */
  a[href^="tel:"] { pointer-events: none; }
  .sp {
  display:none!important;
  }
  .sp-br {
    display: none;
  }
  .pc-none {
    display: none!important;
  }
}

img {
line-height: 0;
max-width: 100%;
vertical-align: bottom;
}

article:after,main:after,
clearfix:after {
content: "";
display: block;
clear: both;
}

figure {
  margin:0;
}

/* -----------------------------------------------------------
common default
------------------------------------------------------------*/
.tc { text-align:center!important; }
.tl { text-align:left!important; }
.fl { float:left; }
.fr { float:right; }
.bold { font-weight:bold; }
.inline { display:inline-block; }
.block { display:block; }
.super { vertical-align: super; font-size:10px;}


/* -----------------------------------------------------------
font-size
------------------------------------------------------------*/

/* -----------------------------------------------------------
font-size
------------------------------------------------------------*/
/* rem相対、px固定*/
@media (min-width: 751px) {
  :root {
    font-size: calc(0.5625rem + ((1vw - 7.68px) * 0.1736));
    min-height: 0vw;
  }
  p,div,span,li,i,td,th,em,dt,dd {
    font-size:1.6rem;
  }
}
@media (min-width: 1344px) {
  :root {
    font-size: 10px;
  }
}
@media (max-width: 1100px) {
  @media (min-width: 751px) {
    :root {
      font-size: calc(0.52rem + ((1vw - 7.68px) * 0.1736));
      min-height: 0vw;
    }

  }
}
@media screen and (max-width:750px) {
  html {
  font-size: 62.5%;
  }
  body { font-size: 1.3rem; }
  p,div,span,li,i,td,th,em,dt,dd {
    font-size:1.3rem;
  }
}


/* -----------------------------------------------------------
共通
------------------------------------------------------------*/
.pb10 { padding-bottom:10px; }
.pb15 { padding-bottom:15px; }
.pb20 { padding-bottom:20px; }
.pb30 { padding-bottom:30px; }
.pb40 { padding-bottom:40px; }
.pb50 { padding-bottom:50px; }
.pb60 { padding-bottom:60px; }
.pb80 { padding-bottom:80px; }
.pb100 { padding-bottom:100px; }

.pt60 { padding-top:60px; }
.pt70 { padding-top:70px; }
.pt80 { padding-top:80px; }
.pt5 { padding-top:3px; }
.pl10 { padding-left:10px; }
.pl20 { padding-left:20px; }
.mt10 { margin-top:10px; }
.mt20 { margin-top:20px; }
.mt40 { margin-top:40px; }
.mt60 { margin-top:60px; }
.mt80 { margin-top:80px; }
.mt100 { margin-top:100px; }
.mt120 { margin-top:120px; }
.mt140 { margin-top:140px; }

.mb5 { margin-bottom:5px; }
.mb10 { margin-bottom:10px; }
.mb15 { margin-bottom:15px; }
.mb20 { margin-bottom:20px; }
.mb30 { margin-bottom:30px; }
.mb40 { margin-bottom:40px; }
.mb50 { margin-bottom:50px; }
.mb60 { margin-bottom:60px; }
.mb70 { margin-bottom:70px; }
.mb80 { margin-bottom:80px; }
.mb100 { margin-bottom:100px; }
.mb110 { margin-bottom:110px; }
.mb120 { margin-bottom:120px; }

.mr20 { margin-right:20px; }

.pt30 { padding-top: 30px; }
.pb20 { padding-bottom:20px; }

.vt { vertical-align: top; }
.tr { text-align :right; }
.bgfff { background: #fff; }

.fs14 { font-size: 14px; }
.fs16 { font-size: 16px; }
.fs18 { font-size: 18px; }
.fs20 { font-size: 20px; }
.fs22 { font-size: 22px; }
.fs24 { font-size: 24px; }
.fs26 { font-size: 26px; }
.fs28 { font-size: 28px; }
.fs30 { font-size: 30px; }
.fs32 { font-size: 32px; }
.fs34 { font-size: 34px; }
.fs36 { font-size: 36px; }
.fs38 { font-size: 38px; }
.fs40 { font-size: 40px; }

.fa {
line-height: 1;
}
i.far {
margin-left:3px;
}

/* -----------------------------------------------------------
page
------------------------------------------------------------*/
.full {
width: 100%;
}
.container {
margin: 0 auto;
max-width:1060px;
position: relative;
width:90%;
}
.container.medium {
margin:0 auto;
max-width:1160px;
width:90%;
}
.container.large {
margin:0 auto;
max-width:1220px;
width:90%;
}

/* -----------------------------------------------------------
	pageTop
------------------------------------------------------------*/
/* scroll top */
#page-top {
  position: fixed;
  bottom: 10px;
  right: 20px;
  background: #aaa;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  display: block;
  width: 44px;
  height: 44px;
  z-index: 10;
}

#page-top a {
  text-decoration: none;
  color: #fff;
  width: 40px;
  height: 40px;
  text-align: center;
  display: block;
  border-radius: 50%;
  text-indent: -9999px;
}
#page-top a:after {
  content: "";
  position: absolute;
  left: 16px;
  top: 19px;
  width: 12px;
  height: 12px;
  border-top: 3px solid #fff;
  border-right: 3px solid #fff;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  z-index: 10;
}
#page-top:hover {
  text-decoration: none;
  opacity: 0.8;
}

/* -----------------------------------------------------------
main
--------------------------------------------------------------*/
#page {
  overflow-x: hidden;
}
#mv {
  width: 100%;
  position: relative;
  display: flex;
  justify-content: center;
  z-index: 0;
}
.cta {
  width:100%;
  min-height:140px;
  padding:2vw 0 1.5vw;
  display: flex;
  justify-content: center;
  align-items: center;
  margin:0 auto;
  text-align: center;
  background:url(../img/bg-cta.jpg)repeat center;
  position: relative;
}
.cta-top {
  background-color: #E2EDF3;
  position: relative;
}
.cta-top:before {
  content:"";
  position: absolute;
  top:-3.5rem;
  left:0;
  right:0;
  margin:auto;
  background: url(../img/ya.png)no-repeat center 0;
  background-size:175px auto;
  width:175px;
  height:59px;
}
.cta img {
  max-width:400px;
  box-shadow: 0 0 10px rgba(0,0,0,0.3);
  border-radius: 10em;
}
.cta-inner {
  width:90%;
  margin:auto;
}
.cta-txt {
  color:#fff;
  font-size: 82%;
  margin-top:1rem;
}
.timetable {
  background:url(../img/bg1.jpg) no-repeat center top;
  background-size:cover;
  padding:6rem 5% 10rem;
  text-align: center;
}
.time-inner {
  max-width:1060px;
  margin:0 auto;
  width:95%;
  border: 8px solid #081665;
  padding:4.5rem 2.5vw;
}
.ttl02 {
  margin:0 auto 3rem;
}
.ttl02 span {
  background: url(../img/mark.svg) no-repeat 1.6rem center;
  background-size: 0.85em;
  background-color: #081665;
  padding: 0.3em 1em 0.3em 1.85em;
  color: #fff;
  font-size: 2.4rem;
}
.blue,
.blue span {
  color:#081665;
}
.ttl {
  display: inline-block;
  padding:1rem 2.3em 3rem;
  background-image:url(../img/leaf01.png), url(../img/leaf02.png);
  background-repeat:no-repeat;
  background-size:auto 100%;
  background-position:0 0, right 0;
  margin:0;
}
.fs36,
.fs36 * {
  font-size: 3.6rem;
}
.ttl span {
  line-height: 1.6;
}
.fs40,
.fs40 span {
  font-size: 4rem;
}
.ttl span {
  border-bottom:1px solid #081665;
}
.time-box {
  background-color: #081665;
  position: relative;
  padding:3rem;
  margin:1rem auto 2rem;
  max-width:870px;
  width:90%;
}
.time-box:before {
  content:"";
  position: absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  margin:auto;
  width:calc(100% - 16px);
  height:calc(100% - 16px); 
  border:2px solid rgba(255,255,255,0.15);
}
.schedule {
  position: relative;
}
.schedule li {
  color:#fff;
  padding-left:1.5em;
  background: url(../img/time.svg)no-repeat 0 center;
  display: inline-block;
  margin-bottom:1.5rem;
  text-align: left;
  background-size:1em;
}
.schedule li,
.schedule li *{
  font-size: 2.6rem;
}
.schedule li:last-of-type {
  margin-bottom:0;
}
.people {
  background-color: #fff;
  line-height: 1.2;
  padding:0.2em 0;
  text-align: center;
  color:#ff0000;
  font-weight: bold;
  display: inline-block;
  margin:0 1rem;
  font-size: 90%;
}
.gentei {
  color:#fff;
  margin:0 1rem 0 2rem;
  display: inline-block;
  font-size: 90%!important;
}
.time-txt {
  margin:4rem 0 0;
}
.time-txt,
.time-txt * {
  color: #081665;
  font-size: 2.1rem;
  font-weight: bold;
}
.marker {
  background: linear-gradient(transparent 70%, #90CFF6 0%);
}
.arrow {
  text-align: center;
  position: relative;
  margin: 0 auto;
  width:175px;
}
.arrow img {
  margin-top:-3.5rem;
}
.present {
  padding:2rem 0 8rem;
  text-align: center;
}
.present-inner {
  max-width:669px;
  margin:0 auto;
  width:60%;
  position: relative;
}
.thoughts {
  background-color: #E2EDF3;
  padding:8rem 0 12rem;
}
.thoughts-inner {
  max-width:1260px;
  width:90%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.thoughts-inner figure {
  width:38%;
}
.thoughts-inner .note {
  width:58%;
}
.note {
  background-color: #fff;
  box-shadow: 0 3px 10px rgba(0,0,0,0.06);
  padding:1rem;
  position: relative;
}
.note:before {
  content:"";
  position: absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  margin:auto;
  border:3px solid #081665;
  width:calc(100% - 15px);
  height:calc(100% - 15px); 
}
.note-box {
  width:90%;
  margin:auto;
  padding:4rem 2rem 2rem;
  position: relative;
}
.note-ttl {
  font-size: 2.2rem;
  color: #081665;
  margin:4rem 0;
}
.note-box p {
  margin-bottom:1.5em;
}
.cg {
  color:#C7A44B;
}
.recommend {
  padding:4rem 0;
}
.recommend-inner {
  max-width:1100px;
  width:90%;
  margin:0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.recommend-txt {
  background: #E1DDCD;
  border-radius: 10px;
  position: relative;
}
.recommend-txt:before {
  content:"";
  position: absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  margin:auto;
  width:calc(100% - 3rem);
  height:calc(100% - 3rem);
  background:url(../img/sha.png)repeat center;
  background-size:15px;
  background-color:#fff;
  box-shadow: 0 0 10px rgba(0,0,0,0.16);
 }
.rec-in {
  position: relative;
}
.check li {
  font-size: 1.8rem;
  line-height:1.6;
  color:#333;
  padding-left:1.5em;
  background: url(../img/check.svg)no-repeat 0 0.3em;
  background-size: 1.3em;
  display: inline-block;
  margin-bottom:0.85em;
}
.check li,
.check li *{
  font-size: 1.8rem;
}
.check li:last-of-type {
  margin-bottom:0;
}
.talk {
  background: url(../img/bg2.jpg)no-repeat 0 0;
  padding:9rem 0;
}
.talk-inner {
  max-width:920px;
  width:90%;
  margin:0 auto;
}
.ttl-box span {
  display: inline-block;
  border:2px solid #081665;
  padding:0.3em 1rem;
  line-height: 1.3;
  color:#081665;
  font-size: 2.2rem;
}
.talk-note {
  background-image: url(../img/talk-note.jpg);
  background-repeat:no-repeat;
  background-position: 95% 3rem;
  background-size:38%;
}
.list-dot {
  margin-left:2em;
}
.list-dot li {
  color:#333;
  font-size: 1.6rem;
  padding-left:1em;
  margin:0 0 0.6em;
  position: relative;
}
.list-dot li:before {
  content:"";
  position: absolute;
  top:0.4em;
  left:0;
  width:0.5em;
  height:0.5em;
  border-radius: 10em;
  background-color: #AADAF8;
}
.ttl-box {
  margin:3.5rem 0 2rem;
}
.small {
  font-size: 85%;
}
.talk .small {
  padding-right:1em;
}
.profile {
  padding:9.5rem 0;
  background: url(../img/bg3.jpg)no-repeat;
  background-size: cover;
}
.profile-inner {
  max-width:1120px;
  width:90%;
  margin:0 auto;
  background-image:url(../img/mark-l.png), url(../img/mark-r.png);
  background-size:12%;
  background-repeat:no-repeat;
  background-position: 0 0, 101% bottom;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0,0,0,0.06);
  padding:5rem 5% 4rem;
}
.profile-inner .flex-pc {
  justify-content: space-between;
}
 .profile-txt p {
  font-size: 1.5rem;
  margin-bottom:1.5em;
  color:#333;
}
.ttl01 {
  font-size: 3rem;
  color:#081665;
  margin:2rem 0 1rem;
  background: url(../img/mark.svg) no-repeat 0 center;
  background-size: 18px;
  padding-left:0.8em;
}
.profile-data {
  margin:1.5rem 0 2rem;
  padding-bottom:2.5rem;
  border-bottom:1px solid #A5AAC7;
}
.profile-data * {
  color:#081665; 
}
.profile-data dt {
  font-size: 1.6rem;
}
.profile-data dd {
  font-size: 2.2rem;
}
.timetable-bottom{
  padding:9rem 0;
}
.time-detail,
.time-detail-sub {
  max-width:500px;
  width:90%;
  margin:0 auto;
  text-align: left;
  padding-left:2rem;
}
.time-detail * {
  color:#081665;
  font-size: 2rem;
  font-weight: bold;
  line-height: 1;
}
.time-detail .red {
  color: #ff0000;
}
.time-detail s {
  margin:0 0.5rem;
}
.time-detail strong {
  margin:0 0.5rem;
}
.big {
  font-style:normal;
  font-size: 200%;
}
.time-detail-sub * {
  font-size: 1.36rem;
  color:#111;
}
.time-detail-sub li {
  text-indent:-1em;
  margin-left:1em;
}


/* -----------------------------------------------------------
	footer
------------------------------------------------------------*/
#footer {
  text-align: center;
  background: #fff;
  height:80px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.footer-copyright {
  font-size:1.2rem;
  text-align: center;
  color:#333;
  letter-spacing: 0.1em;
}

/* -----------------------------------------------------------
mediaQuery レスポンシブ
------------------------------------------------------------*/
@media screen and (min-width: 751px) {
  .sp {
    display: none;
  }
  .flex-pc {
    display: flex;
  }
  .profile-txt {
    width:50%;
  }
  .profile figure {
    width:42%;
    margin-top:7.5rem;
  }
  .recommend figure {
    width:45%;
  }
  .recommend-txt {
    max-width: 755px;
    width: 73%;
    padding: 5rem;
    margin-top: -10rem;
    margin-right: -12%;
  }
}
@media (max-width: 750px) {
  .pc {
    display: none !important;
  }
  .sp {
    display: block !important;
  }
}


@media screen and (min-width:751px) and (max-width: 1200px) {
  .fs36, .fs36 * {
    font-size: calc(32/1200*100vw);
  }
  .cta {
    min-height:calc(140/1200*100vw);
  }
  .cta img {
    max-height:calc(82/1200*100vw);
  }
  .cta-top:before {
    background-size: calc(180 / 1200* 100vw) auto;
    height: calc(59 / 1200* 100vw);
    top: -3vw;
  }
  .arrow img {
    height: calc(70 / 1200* 100vw);
  }
  .schedule li, .schedule li * {
    font-size: calc(26/1200*100vw);
  }
  .ttl02 span,
  .ttl-box span {
    font-size: calc(24/1200*100vw);
  }
  .note-ttl {
    font-size: calc(25/1200*100vw);
  }
 
}

@media screen and (max-width: 1200px) {
  .time-inner {
    border-width:6px;
  }
  .ttl02 {
    margin-bottom:1.5vw;
  }
  .time-txt {
    margin-top:2.5vw;
  }
  .time-txt, .time-txt *{
    margin-bottom:0;
  }
  .timetable {
    padding-bottom:7vw;
  }
  .present {
    padding:0 0 4vw;
  }
  .ttl02 span {
    padding-bottom: 0.4em;
  }
  .note-ttl {
    margin:3.5vw 0;
  }
  .recommend figure {
    width:38%;
  }
  .recommend-txt {
    padding:4vw 5%;
  }
  .thoughts {
    padding:6vw 0 8vw;
  }
  .recommend-txt {
    margin-top:-5vw;
  }
  .talk {
    padding:6vw 0;
  }
  .profile,
  .timetable-bottom {
    padding:8vw 0;
  }
  #footer {
    height: 50px;
  }

}

@media screen and (min-width: 1024px) {
  .md {display: none;}
}

@media screen and (max-width: 1023px) {
  .thoughts-inner {
    display: block;
  }
  .thoughts-inner figure {
    display: none;
  }
  .thoughts-inner .note {
    width:100%;
  }
  .check li, .check li * {
    font-size: 1.6rem;
  }
}

/* -----------------------------------------------------------------------------
スマホSP
------------------------------------------------------------------------------*/

/*--------------------------------------------------
750px以下
/*--------------------------------------------------*/
@media screen and (max-width: 750px) {
  #page-top {
    bottom: 15px;
    right: 5px;
  }
  .cta {
    min-height: auto;
  }
  .cta-inner {
    padding:1.5rem 1rem 1.5rem;
  }
  .cta img {
    width: 88%;
    max-width: 600px;
  }
  .cta-top:before {
    background-size: calc(200 / 750* 100vw) auto;
    height: calc(80 / 750* 100vw);
    top: -5vw;
  }
  .arrow img {
    height: calc(70 / 750* 100vw);
  }
  .timetable {
    padding:4rem 5% 10vw;
  }
  .time-inner {
    border-width: 5px;
  }
  .ttl02 span {
    font-size: 1.6rem;
  }
  .fs36, .fs36 * {
    font-size: 4.6vw;
    font-size: 4.4vw
  }
  .ttl {
    padding: 1rem 2em 1rem;
    background-size:contain;
  }
  .ttl02 {
    margin-bottom: 2rem;
  }
  .time-inner {
    width:100%;
    padding:6vw 3%;
  }
  .schedule li, .schedule li * {
    font-size: 3.8vw;
  }
  .time-box {
    padding:2.5rem;
    width:93%;
  }
  .time-box:before {
    width: calc(100% - 10px);
    height: calc(100% - 10px);
  }
  .schedule li {
    background-position:0 0.3em;
    margin-bottom:2rem;
  }
  .time-txt, .time-txt * {
    font-size: 1.36rem;
    text-align: left;
  }
  .present-inner {
    width:90%
  }
  .thoughts {
    padding: 10vw 0;
  }
  .note-box {
    padding:2rem 0;
  }
  .note-ttl {
    font-size: 4.2vw;
    margin:3rem 0 2rem;
  }
  .check li, .check li * {
    font-size: 3.6vw;
  }
  .recommend-txt:before {
    width: calc(100% - 2rem);
    height: calc(100% - 2rem);
  }
  .recommend-txt {
    margin-top: 0;
    padding:3.5rem 3rem;
  }
  .recommend {
    padding: 6vw 0 0;
  }
  .recommend-inner {
    display: block;
    margin-bottom:3rem;
  }
  .ttl-box span {
    font-size: 4vw;
  }
  .talk-note {
    background-position: 95% 1rem;
  }
  .ttl-box {
    margin: 2.5rem 0 2rem;
  }
  .list-dot li {
    font-size: 3.6vw;
  }
  .list-dot {
    margin-left: 0;
  }
  .talk {
    padding: 12vw 0;
  }
  .profile-inner {
    padding: 1rem 5% 2rem;
    background-size: 18%;
  }
  .profile-data dt {
    font-size: 3.5vw;
  }
  .ttl01  {
    font-size: 2.4rem;
  }
  .profile-data dd {
    font-size: 1.9rem;
  }
  .profile-data {
    padding-bottom:2rem;
  }
  .profile-txt p {
    font-size: 3.5vw;
  }
  .profile-img {
    width:65%;
    margin:0 auto 2rem;
  }
  .profile {
    padding: 12vw 0;
  }
  .timetable-bottom  {
    padding:12vw 5%;
  }
  .present {
    padding-bottom:7vw;
  }
  .time-detail, .time-detail-sub {
    padding-left:0;
  }
  .time-detail * {
    font-size: 3.5vw;
    line-height: 1.4;
  }
  .time-detail-sub * {
    font-size: 3.2vw;
  }

  #footer {
    height:50px;
  }
  .footer-copyright {
    font-size: 11px;
    text-align: center;
  }

}

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


/* sm サイズ*/
@media screen and (max-width: 575px) {
.sm {
    display: none!important;
  }

}

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

}

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

}


/* -----------------------------------------------------------
animation
-------------------------------------------------------------*/
.ani{
  animation: rotate-anime 20s linear infinite;
}
@keyframes rotate-anime {
  0%  {transform: rotate(0);}
  100%  {transform: rotate(360deg);}
}
.fade-in {
    animation: fadeIn 1.5s ease 0s 1 normal;
}
@keyframes fade-in {
0% {
  opacity: 0;
}
0% {
  opacity: 100;
}
}


