/*paddingとborderがwidthとheightの中に含まれるようになる*/
*, *:before, *:after { -webkit-box-sizing: border-box; box-sizing: border-box; }

.est_time_caption--blank { display: inline-block; width: 30px; height: 17px; background: #FFFFFF; border: 1px solid #333333; border-radius: 3px; margin: 0 2px; vertical-align: bottom; }
.est_time_caption { display: inline; background: #FFFFFF; border: 1px solid #333333; border-radius: 3px; padding: 0 4px; margin-right: 1px; }

.pc { display: block; }
.sp { display: none; }

body { font-family: 'Noto Serif JP', serif; }

.wrapper { width: 1080px; margin: 40px auto 0; border: 30px solid #ddd; padding: 20px; text-align: right; position: relative; }

.vertical-box { background-color: #fff; padding: 20px 10px; display: inline-block; text-align: right; width: 638px; }
.vertical-box-end { width: 100%; }
.vertical-box-end2 { width: 100%; }

.vertical-box:nth-child(n+2) {
  margin-top: 0.5em;
}

.paragraph { text-align: right; display: flex; justify-content: flex-end; }

.box-01 { height: 778px; }
.box-02 { height: 603px; }
.box-03 { height: 830px; }
.box-04 { height: 637px; }
.box-05 { height: 465px; }
.box-06 { height: 300px; }

.vertical-text {
  text-align: left;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-orientation: upright;
  display: inline-block;
  width: 100%;
}

.vertical-text p:nth-of-type(n+2) {
  margin-right: 1em;
}

.vertical-text p { line-height: 245%; font-family: 'Noto Serif JP', serif; font-size: 14px; color: #222; font-weight: 600; }

.vertical-text p img { width: 280px; height: auto; margin: 0 10px; }

.vertical-text a img { transition: opacity .5s; }
.vertical-text a:hover img { transition: opacity .5s; opacity: 0.6; }

.big-title { font-size: 800%; font-weight: 900; font-family: 'Noto Sans JP', serif; line-height: 100%; letter-spacing: -3px; position: relative; }
.big-title img { width: 100%; }

.modaal-gallery-item img {
display: block;
  width: 80%;
  margin: 0 auto;
  max-width: 980px;
}

.modaal-image .modaal-container {
  width: auto;
  max-width: 100%;
  background: rgba(255,0,0,0);
}


a.modal { display: block; position: relative; z-index: auto; }
a.modalspacia { display: block; position: relative; z-index: auto; }


.catagory-1-box { position: absolute; top: 130px; left: 23px; width: 618px; }
.catagory-1-box a img { transition: opacity .5s; opacity: 1; }
.catagory-1-box a:hover img { transition: opacity .5s; opacity: 0.8; }

.modaal-gallery-item img { width: 800px; }

.left-box { position: absolute; left: 72px; top: 787px; width: 207px; }
.left-box img { width: 100%; }

.left-box a img { transition: opacity .5s; opacity: 1; }
.left-box a:hover img { transition: opacity .5s; opacity: 0.6; }

/*.vertical-box-end div.paragraph div.vertical-text p img { margin: 0 20px; }*/
/*.vertical-box-end div.paragraph div.vertical-text p { line-height: 126%; }*/

.vertical-box-end2 div.paragraph div.vertical-text p img { margin: 12px 20px 0 0; }
.vertical-box-end2 div.paragraph div.vertical-text p.text-3 { line-height: 250%; margin-right: 30px; }

p.title-1 { font-weight: 900; font-size: 175%; line-height: 132%; margin-right: 10px; font-family: 'Noto Sans JP', serif; color: #190909; letter-spacing: -2px; }
p.title-2 { font-weight: 400; font-size: 140%; line-height: 132%; color: #190909; letter-spacing: -1px; }
p.text-2 { line-height: 230%; }

p span {
  /* ↓↓ 追加コード　↓↓ */
  text-combine-upright: all;
}

.caution-1 { width: 980px; margin: 40px auto 100px; overflow: hidden; }

.plusoneitem-title {
  width: 100%;
  margin: 40px auto 20px;
  color: #666;
  border: 2px solid #999;
  border-radius: 20px;
  padding: 10px;
  font-size: 120%;
  font-weight: 900;
  text-align: center;
}

.plusoneitem-banner { width: 100%; overflow: hidden; }

.plusoneitem-banner a {
  float: left;
  width: 49%;
  margin: 0 1.2% 0 0;
  text-align: center;
}

.plusoneitem-banner a:last-child {
  float: right;
  width: 49%;
  margin: 0;
  text-align: center;
}

.plusoneitem-banner a img { opacity: 1.0; transition: opacity .5s; }
.plusoneitem-banner a:hover img { opacity: 0.6; transition: opacity .5s; }

.navigation-pagelink { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 60px 0 60px; }
.navigation-pagelink a { text-decoration: none; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 673px; height: 50px; border: 2px solid #0062a0; font-size: 19px; font-weight: bold; color: #0062a0; position: relative; -webkit-transition: .3s ease all; transition: .3s ease all; }
.navigation-pagelink a::after { content: url(../img/common/icon_arrow.png); position: absolute; top: 50%; right: 20px; -webkit-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: .3s ease all; transition: .3s ease all; }
.navigation-pagelink a:hover { text-decoration: none; background: #0062a0; color: #fff; }
.navigation-pagelink a:hover::after { content: url(../img/common/icon_arrow_w.png); right: 10px; }

@media screen and (max-width: 767px) { .navigation-pagelink { width: 85%; margin: 0 auto; padding: 40px 0 40px; } }
@media screen and (max-width: 767px) { .navigation-pagelink a { width: 100%; font-size: 12px; height: 40px; } }

#footer ul {
  display: block;
  margin: 20px auto 0;
  font-size: 85%;
  padding-left: 12px;
  clear: both;
  width: 100%;
  text-align: left;
}
#footer ul li {
  list-style: none;
  margin: 0;
    margin-bottom: 0px;
  margin-bottom: 0px;
  padding: 0;
  position: relative;
  display: block;
  margin-bottom: 6px;
  line-height: 140%;
  font-weight: normal;
  font-size: 85%;
}
#footer ul li::before {
  position: absolute;
  content: "●";
  width: 10px;
  height: 10px;
  display: inline-block;
  top: 0px;
  left: -12px;
}





img.banner-00001 { width: 200px; margin: 0 0 0 30px; }

.movie-banner-wrapper { padding-top: 200px; }
.movie-banner { -webkit-writing-mode:horizontal-tb; -ms-writing-mode:lr-tb; writing-mode:horizontal-tb; position: absolute; left: 44px; }
.movie-banner img { width: 100%; max-width: 715px; }

div.img-1 { float:left; padding: 220px 20px 20px 20px; }
div.img-1 img.img-1 { width: 613px; }
div.text-1 p { padding: 10px; line-height: 180%; margin: 0 5px 0 5px }

div.img-2 { float:left; padding: 0 0 20px 0; }
div.img-2 img.img-2 { width: 429px; }

div.title-wrapper { background-color: #727171; float: left; margin: 0 0 0 12px; }
div.title-wrapper p.title-gear { color: #fff; font-weight: 900; font-family: 'Noto Sans JP', serif; border-top: solid 1px #fff; border-bottom: solid 1px #fff; margin: 10px auto; }

div.img-3 { float:left; padding: 0 0 15px 0; }
div.text-2 img.img-3 { width: 211px; float: left; margin: 0 0 16px 0; }
div.text-2 p { padding: 10px; line-height: 155%; margin: 0 5px 0 5px }

p.title-1 b { font-size: 165%; display: block; margin: 0 10px 0 0; }

div.img-4 { float:left; padding: 12px 25px 20px 0; }
div.img-4 img.img-4 { width: 522px; }
p.text-3 img.img-5 { width: 102px; }
div.img-6 { float:left; padding: 12px 35px 20px 0; }
div.img-6 img.img-6 { width: 265px; }


p.title-1 b.b-title2 { font-size: 165%; display: block; margin: 0 0 0 10px; color: #fff; text-shadow:1px 1px 0 #000, -1px -1px 0 #000,
              -1px 1px 0 #000, 1px -1px 0 #000,
              0px 1px 0 #000,  0-1px 0 #000,
              -1px 0 0 #000, 1px 0 0 #000; }
div.img-7 { float:left; padding: 12px 20px 0 0; height: 286px; }
.vertical-box-end div.paragraph div.vertical-text p { line-height: 173%; }
div.img-7 img.img-7 { width: 660px; margin: 0 23px 0 0; }
div.img-8 { float:right; padding: 0 20px 20px 0; height: 516px; }
div.img-8 img.img-8 { width: 312px; margin: 0 38px 0 0; }

p.title-3 { font-weight: 900; font-size: 173%; line-height: 132%; margin-right: 37px; margin-top: 60px; font-family: 'Noto Sans JP', serif; color: #190909; letter-spacing: -2px; text-shadow:1px 1px 0 #fff, -1px -1px 0 #fff,
              -1px 1px 0 #fff, 1px -1px 0 #fff,
              0px 1px 0 #fff,  0-1px 0 #fff,
              -1px 0 0 #fff, 1px 0 0 #fff; position: relative; z-index: 10; }
p.title-3 b.b-title3 { font-size: 164%; display: block; margin: 0 0 0 10px; color: #000;}
div.img-7 img.img-9 { position: absolute; z-index: 0; width: 926px; right: -170px; top: 0;}

div.img-7 p { position: relative;

  display: inline-block;

  vertical-align: middle;
 }

div.img-10 { float:right; padding: 0 20px 20px 0; height: 350px }
div.img-10 img.img-10 { width: 408px; margin: 0 26px 0 0; }

p.title-4 { font-weight: 900; font-size: 195%; margin-left: 27px; line-height: 132%; margin-right: 10px; font-family: 'Noto Sans JP', serif; color: #190909; letter-spacing: -2px; }
p.title-4 b { display: block; margin: 0 0 0 10px; color: #000;}
img.img-11 { width: 519px; margin: 10px 26px 0 0; }

div.title-wrapper2 { background-color: #727171; margin: 0 0 0 12px; }
div.title-wrapper2:nth-child(n+2) { margin-right: 40px; }
div.title-wrapper2 p.title-gear2 { color: #fff; font-weight: 900; font-family: 'Noto Sans JP', serif; border-top: solid 1px #fff; border-bottom: solid 1px #fff; margin: 10px auto; padding: 15px 0 0;
  font-size: 126%;
  line-height: 174%;
  letter-spacing: -1px; }
div.img-12 { float:left; padding: 0 10px 20px 0; }
div.img-12 img.img-12 { width: 316px; margin-top: -48px; }
p.text-12 { line-height: 176%; margin: 0 25px 0 0; }
img.img-13 { width: 194px; margin: 0 26px 0 0; }

span.space { font-size: 50%; }

div.catagory-title-box { position: relative; }
div.catagory-title-box p { position: absolute; right: 0; top: -49px; display: block; background-color: #f7ca44; padding: 10px 20px; color: #fff; border-radius: 25px; }

hr.catagory-title-box { margin-top: 3rem; border-color: #f7ca44; }

div.title-wrapper div.pickup { position: absolute; right: -36px; writing-mode: horizontal-tb; background-color: #f7ca44; color: #fff; font-size: 70%; padding: 23px 14px; border-radius: 100px; white-space: nowrap; z-index: 100; text-align: center; top: -32px; line-height: 159%; }

div.text-2 p.pickup { padding-top: 42px; }

.js-hover {
  opacity: 0.3; transition: opacity .5s;
}
.js-box { transition: opacity .5s; }
.js-box2 { transition: opacity .5s; }

/*.img-4:hover ~ .img-6 img { opacity: 0.3; }
.img-7:hover ~ .img-8 img { opacity: 0.3; }*/

a.movie-btn:hover { cursor: pointer; }
#modalvideo { width: 100%; }