@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@500;700&display=swap');

body { background:url(img/bg.jpg); background-size: 100%;}

/* body {position: relative;}

body::before {    content: "";
  background: url(img/bg.jpg);
  background-size: 100%;
  display: inline-block;
  width: 100%;
  height: 100%;
  position: absolute;}

  body::after {
    content: "";
    background: url(img/bg.jpg);
    background-size: 100%;
    display: inline-block;
    top: 100%;
    width: 100%;
    height: 100%;
    position: absolute;
    transform: scale(-1, 1);
  } */


main { background:-moz-linear-gradient(top, rgba(255,255,255,0) 20%, rgba(255,255,255,0.8) 100%);
background:-webkit-linear-gradient(top, rgba(255,255,255,0) 20%,rgba(255,255,255,0.8) 100%);
background:linear-gradient(to bottom, rgba(255,255,255,0) 20%,rgba(255,255,255,0.8) 100%);
}
main.form { background:-moz-linear-gradient(top, rgba(255,255,255,0.2) 0, rgba(255,255,255,0.8) 100%);
background:-webkit-linear-gradient(top, rgba(255,255,255,0.2) 0,rgba(255,255,255,0.8) 100%);
background:linear-gradient(to bottom, rgba(255,255,255,0.2) 0,rgba(255,255,255,0.8) 100%);
}
main.sans-serif{ font-weight:inherit; }
.subttl2:before { background:#742f5a; }
.tbl tr > * { border-color:#5fbc91; }
.tbl tr > th { background:#96d0b6; }
.tbl tr > td { background:rgba(255,255,255,.6); }

/* common */

.serif {font-family:'Cardo', "游明朝", "Yu Mincho", YuMincho,"ヒラギノ明朝 ProN W6", "HiraMinProN-W6","HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}
.noteTtl,.heading,.flow>li::before,.flow_txt,.ttl,.schedule,#ohanashi { font-family:'M PLUS Rounded 1c', sans-serif; transform:rotate(0.03deg); }

.underline { text-decoration:underline; }

.heading { line-height:1; font-size:2.5em; color:#742f5a; text-align:center; font-weight:bold; letter-spacing:.1em; }
.heading>span{ display:inline-block; padding:0 2.5em; position:relative;}

.heading>span::before,
.heading>span::after{ position:absolute; left:0; top:0; bottom:0;  margin:auto; display:block; height:1em; width:2em; max-width:70px; background:url(img/h2_before.png) no-repeat left center; background-size:100%; content:'';}

.heading>span::after{ right:0; left:auto; background-image:url(img/h2_after.png); background-position:right; }

.button { color:#fff; background:#e81626; }
.button::after { background:#cc1321; }
.button:hover { color:#fff; }
.btn_app .button { padding:1.5em 4em; font-size:1.5em; font-weight:bold; letter-spacing:.1em; }
.button:before { content:""; position:absolute; top:0; right:0; bottom:0; left:0;
 opacity:.6; background:url(/img/common/ptn_asanoha.svg) top left / 15%; }

/* main visual*/
.mainVisual { position:relative; padding:115% 0 2rem ; background:url(img/bg_main.jpg) no-repeat; background-size:100%; }

.mainttl{ position:absolute; top:4rem; left:0; right:0; margin:2rem auto 0 5%; padding:0 1rem; width:1000px; max-width:90%; z-index:2; }
.mainttl>img{ position:relative; max-width:20vw; }


.maintxt{ position:absolute; top:65px; left:55%; width:50%; max-width:800px ; margin:0; }
.data { margin:auto; padding:0 1rem; width:1000px; max-width:90%; }
.data>p {position:relative;}
.data>p>img { position:relative; z-index:1; }

.corona_notes {position:relative;}
.corona_notes>.noteTtl { position:absolute; bottom:100%; width:100%; margin:0 0 1rem; font-size:1.5rem; text-align:center; color:#742f5a; }
.corona_notes>ul { max-width:810px; margin:0 auto 5rem; padding:.5rem 1.5rem; border-radius:1rem; background:rgba(255,255,255,.6); }
.corona_notes>ul>li { position:relative; margin:1rem 0 1rem 1.2rem ; }
.corona_notes>ul>li::before { content:'●'; position:absolute; left:-1.2rem; color:#742f5a;}

.notice { padding: .5em 1em; border: 1px solid #c00; background: rgba(255,255,255,.6); }

/*　概要　*/
#schedule { position:relative; }
#schedule::before { width:406px; height:367px; position:absolute; top:6.5%; left:-20px; max-width:43%; display:block; background:url(img/map_ttl.png) no-repeat; background-size:contain; content:'';}
#schedule>.map{position:relative; z-index:1; margin: 2em 0 0 auto; width: 60%;}

.movie_popup figure {padding: unset; border: none;}

/* 当日の流れ */
.flow { margin:0 0 60px; counter-reset:number; padding:0;}
.flow>li { position:relative; margin:0 1rem 5px; padding:1rem 1rem 1rem 7rem; color:#c4aec4; list-style-type:none; background:#c4aec4; border-radius:1em; }
.flow>li:nth-child(2),.flow>li:nth-child(3),.flow>li:nth-child(6){ background:#f098ab; color:#f098ab;}
.flow>li:nth-child(4){ background:#ec7289; color:#ec7289;}
.flow>li:nth-child(5){ background:#f4b2be; color:#f4b2be;}

.flow>li::before { position:absolute; left:2rem; display:block; counter-increment:number; content:counter(number); width:2em ; text-align:center; background:url(img/bg_flow_no.png) no-repeat; background-size:contain;}

.flow>li>p{ margin:0; color:#fff;}
.flow>li>p.flow_txt,.flow>li::before{ font-size:1.8rem; }

.flow>.has_img { padding-right:140px;}
.flow>.has_img>figure { position:absolute; bottom:.3rem; right:1rem; z-index:1; width:120px;}
.flow>.has_img>.flow_img1{ right:.3rem; bottom:-.6rem; width:154px;}
.flow>.has_img>.flow_img2{ bottom:-.4rem}

.movie_popup {margin-top: 3em;}

/* タイムスケジュール */

#schedule>p { color:#742f5a; }

.schedule { max-width:900px; margin:auto;}
.schedule>div { width:47%; }
.schedule>div>p {width:60%; margin:0 0 5px; padding:.6rem 1.5rem; background:#fff; border-radius:.6rem;}
.schedule>div>p.ttl{ background:#bed63a; font-size:1.5em; color:#fff;}
.schedule>div>p.time{ width:39%; background:#e2e87d;}
.schedule>div>p.wide { width:100%; text-align:center;}

.schedule>div.pm>p.ttl{ background:#94c644;}
.schedule>div.pm>p.time{ background:#c1db7e;}

/* 動画 */
video { display: block; width: 80%; margin: 4em auto; z-index: 1; position: relative; }


/* おはなし会 */
#ohanashi { position:relative; font-size:1.25em; color:#742f5a; background:url(img/ohanashi_bg.png) top right no-repeat; margin-right:-4rem; padding-right:4rem; }
#ohanashi>.ttl {position:relative; z-index:1; width:60%; margin:2rem auto -4rem; padding-top:2rem; }
#ohanashi>div{ position:relative; width:90%; max-width:900px; margin:0 auto 5rem; padding:7rem 2rem 3rem; border-radius:1rem; background:rgba(255,255,255,.6); }
#ohanashi>div::before,#ohanashi>div::after{ content:''; position:absolute; background-size:contain; background-repeat:no-repeat;}
#ohanashi>div::before{ z-index:-1; top:-5rem; right:80%; background-image:url(img/ohanashi_deco1.png); width:231px; height:220px;}
#ohanashi>div::after{ background-image:url(img/ohanashi_deco2.png); width:204px; height:166px; bottom:-95px; left:80%;}

#ohanashi>div>div{position:relative;width:48% ;}
#ohanashi>div>div>figure>img{ border-radius:1rem; overflow:hidden; }

/* お問合せ */
.contact_753 { max-width: 900px; margin: 25px auto; padding-block: 30px 5px; border-radius:1rem; background:rgba(255,255,255,.6); }
.contact_753 h2 { color: #742f5a; font-size: 1.3em; font-weight: bold; line-height: 1;}

/* 知恩院 */
#temple { position:relative; border-top:#ccbe62 solid 4px; background:url(img/temple_bg2.png)bottom right no-repeat,rgba(255,255,255,.6); background-size: 15%; margin-top:4rem; padding:5rem 0 2rem; }
#temple::before { border-top:#ccbe62 solid 1px; position:absolute; content:''; top:5px; left:0; width:100%;}

#temple>.head>h2{ width:271px; max-width:27%; margin:.5rem 0 0;}
#temple>.head>.txt { margin:0; width:calc(95% - 271px); min-width:68%;}

#temple>.body{ position:relative; padding-top:2rem; margin-bottom: 5em;}
#temple>.body::before { display:block; position:absolute; top:-30px; left:-132px; width:399px; height:152px; background:url(img/temple_bg1.png) center no-repeat; background-size:contain; content:'';}

#temple>.body>div{ width:48%; z-index:1; bottom:2rem; }

#temple .txtbox { position:relative; margin:1.5rem 0 3rem; }
#temple .txtbox>h3 { font-size:1.75rem; font-weight:bold; line-height:1;}
#temple .txtbox>h3>span { font-size:1rem; margin-left:1rem;}
#temple .txtbox>.label { position:absolute; top:0; right:0; margin:0; line-height:1.5; padding:.1em .8em 0; border:#333 1px solid; background:#fff; }


/* form */
.subttl2 + .tbl { margin-top:0; }
.subttl2 + * + .tbl { margin-top: 10px; }

input[type="radio"] { margin-right:.2em; }
table.member label { margin-left:1.2em;}
table.member label>:first-child { margin-left:-1.2em;}

.submit { margin-top: 1em; }

.thanks_box { margin:25px 0 50px; }
.thanks_box .subttl2 { font-size:1.1em; font-weight:bold; }

.thanks_note li { position:relative; margin-bottom:.8em; padding-left:1.5em; font-size:1.05em; font-weight:bold; letter-spacing:.1em; }
.thanks_note li:before { content:""; position:absolute; left:.3em; top:.55em; width:.5em; height:.5em; border-radius:50%; background:#742f5a; }
.thanks_note li:last-child { margin-bottom:0; }

/* 600以上(PC・タブレット) */
@media screen and (min-width:600px) {
  h1.heading { margin-top:1em; }
  .contact_753 a[href^="tel:"]{pointer-events: none;}
}
/* 960px以上(PC) */
@media screen and (min-width:960px) {
.inner {max-width:900px; margin:auto;}
}


/* 959以下 (タブレット以下)*/
@media screen and (max-width:959px) {

  header#header{ height:62px; }

  .mainttl {top:0;}
  .data>p::after {left:-15%; width:135%; }

  .heading {font-size:5vw;}
  .heading>span>img { max-width:50vw;}

  img.flow2{ max-width:59%; }

  .flow>li { padding-left:4rem; margin:0 0 2px; }
  .flow>li::before{ left:1rem; }
  .flow>li>p.flow_txt,.flow>li::before{ font-size:1.2rem; }

  .flow>.has_img { padding-right:110px;}
  .flow>.has_img>figure { width:98px;}
  .flow>.has_img>.flow_img1 { bottom:-.4rem; width:125px;}
  .flow>.has_img>.flow_img2{ bottom:-.3rem}

  #schedule::before{ max-width:40%; left:auto; right:64%;}

  #temple>.head>h2,#temple>.head>.txt { width:100%; max-width:none; }
  #temple>.head>h2{ margin:0 0 2rem; text-align:center; }
  #temple>.head>h2>img{ max-width:50%;}

  .maintxt {top: 2em; left: 52%;}
}

@media screen and (max-width:599px) {
  .mainVisual { padding: 117% 0 2rem;}
  .maintxt {top: -1em; left: 77%;}
  #schedule::before {top: 6%;}
  #schedule>.map{ width: 80%;}
  .heading {font-size:6vw;}

  .mainttl>img{ max-width:30vw; }
  .maintxt{ position:absolute; top:30px; left:55%; width:50%; max-width:800px ; margin:0; }

  .movie_popup {margin-block: 0 2em;}

  .flow>li>p.flow_txt,.flow>li::before{ font-size:1rem; }

  .flow>.has_img { padding-right:110px;}
  .flow>.has_img>figure { width:90px;}
  .flow>.has_img>.flow_img1 { width:115px;}

  .schedule.flex { display:block; }
  .schedule>div { max-width:500px; width:100%; margin:1rem auto; }

  #ohanashi>.flex>div,#temple>.flex>div{ width:100%; }
  #ohanashi>div::before{ top:-1rem; right:72%; width:200px; height:190px;}
  #ohanashi>div::after{ width:204px; height:135px; bottom:-40px; left:75%;}

  #temple { background-size: 26%; }

  .btn_app .button { font-size:1.2em; }

  .thanks_note li { font-size:1em; }

  video { width: 100%; margin: 4em auto 3em;}

  /* お問合せ */
  .contact_753 { width: 90%;}
}

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