@charset "UTF-8";
/* CSS Document */
/* ================================================
reset arnoのコピー
================================================ */
* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

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

html {
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}

html::-webkit-scrollbar {
  width: 1px;
}

html::-webkit-scrollbar-thumb {
  background: #fff;
}

body, h1, h2, h3, h4, h5, h6, p, dl, dt, dd, ol, ul, li {
  margin: 0;
  padding: 0;
  font-size: inherit;
}

header, nav, footer, section {
  display: block;
}

ul {
  list-style: none;
}

a {
  color: inherit;
  text-decoration: none;
  -webkit-transition: .2s;
  transition: .2s;
}

img {
  border: 0;
  width: 100%;
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}


/* ================================================
layout
================================================ */
body {
  height: 100%;
  line-height: 1.6;
  background: #1b1c20 url("../img/common/bg.jpg") no-repeat top/cover fixed;
  font-family: -apple-system,BlinkMacSystemFont,'Helvetica Neue','Segoe UI','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','Meiryo UI',Meiryo,sans-serif;
  font-size: .18rem;
  font-feature-settings: 'palt';
  -webkit-font-feature-settings: 'palt';
  letter-spacing: .08em;
}

@media (max-width: 750px) {
  body {
    font-size: .24rem;
  }
}

.wrapper {
  margin: 0 auto;
  position: relative;
  width: 100%;
  max-width: 1200px;
}

@media (min-width: 751px) {
  .wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

.contents {
  margin: 0 auto;
  width: 100%;
  height: 100%;
  min-height: 100vh;
  color: #fff;
  background: rgba(0, 0, 0, 0.6);
}

@media (min-width: 751px) {
  .contents {
    margin: 0 0 0 auto;
    padding: .3rem .5rem;
    width: calc(100% - 240px);
  }
}

@media (max-width: 750px) {
  .contents {
    padding: 1.4rem .3rem;
  }
}

.contents p, .contents dl, .contents ul {
  text-shadow: #000 2px 0 2px, #000 -2px 0 2px, #000 0 -2px 2px, #000 0 2px 2px, #000 2px 2px 2px, #000 -2px 2px 2px, #000 2px -2px 2px, #000 -2px -2px 2px, #000 1px 2px 2px, #000 -1px 2px 2px, #000 1px -2px 2px, #000 -1px -2px 2px, #000 2px 1px 2px, #000 -2px 1px 2px, #000 2px -1px 2px, #000 -2px -1px 2px;
}

.sidebar {
  -webkit-box-shadow: 0 0 0.1rem 0 rgba(0, 0, 0, 0.7);
          box-shadow: 0 0 0.1rem 0 rgba(0, 0, 0, 0.7);
  position: fixed;
  z-index: 50;
  width: 100%;
  background: rgba(255, 255, 255, 0.5);
  overflow-y: scroll;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.sidebar::-webkit-scrollbar {
  display: none;
}

@media (min-width: 751px) {
  .sidebar {
    width: 240px;
    height: 100%;
  }
}

.sidebar .qr {
  margin: 26px 0 0 0;
  color: #2b1d26;
  font-weight: bold;
  font-size: 12px;
  text-align: center;
}

@media (max-width: 750px) {
  .sidebar .qr {
    display: none;
  }
}

.sidebar .qr img {
  margin: 0 0 20px 0;
  width: 82px;
}




/* ================================================
rem 文字の大きさ
================================================ */
html {
  font-size: 625%;
}

@media (min-width: 751px) and (max-width: 1280px) {
  html {
	font-size: calc(100vw / 19.8);
  }
}

@media (max-width: 750px) {
  html {
    font-size: calc(100vw / 10.67);
  }
}

/* ================================================
nav ロゴ+ナビ+qr
================================================ */
.logo {
  height: 2em;
  text-align: center;
  letter-spacing: .02em;
}
/*
.logo img {
	 width: 80%;
	max-width: 200px;
    height: auto;
}
*/


nav .slidebar {
  line-height: 1;
  text-align: center;
  letter-spacing: .02em;
}

.slidebar li {
/*  color: #C95673;*/
	border-bottom: dashed 1px #C95673;/*A19*/
  cursor: pointer;
  -webkit-transition: .2s;
  transition: .2s;
}

.slidebar li:hover {
 /* color: #ffa800;*/
  text-shadow: rgba(255, 255, 255, 0.3) 2px 0 2px, rgba(255, 255, 255, 0.3) -2px 0 2px, rgba(255, 255, 255, 0.3) 0 -2px 2px, rgba(255, 255, 255, 0.3) 0 2px 2px, rgba(255, 255, 255, 0.3) 2px 2px 2px, rgba(255, 255, 255, 0.3) -2px 2px 2px, rgba(255, 255, 255, 0.3) 2px -2px 2px, rgba(255, 255, 255, 0.3) -2px -2px 2px, rgba(255, 255, 255, 0.3) 1px 2px 2px, rgba(255, 255, 255, 0.3) -1px 2px 2px, rgba(255, 255, 255, 0.3) 1px -2px 2px, rgba(255, 255, 255, 0.3) -1px -2px 2px, rgba(255, 255, 255, 0.3) 2px 1px 2px, rgba(255, 255, 255, 0.3) -2px 1px 2px, rgba(255, 255, 255, 0.3) 2px -1px 2px, rgba(255, 255, 255, 0.3) -2px -1px 2px;
}

.slidebar li a {
  color: #783345;/*A19*/
}

.slidebar li a.current {
/*  color: #000;
	  background: rgba(0,144,145, 0.9);
  background: url("../img/common/nav_current.png") no-repeat center/contain;*/
}
nav a {
  padding: 0.5em 0;
  display: block;
}


.qr {
  margin: 26px 0 0 0;
 /* color: #2b1d26;*/
  font-weight: bold;
  font-size: 12px;
  text-align: center;
}
.qr img {
  margin: 0 0 20px 0;
  width: 82px;
}

@media (max-width: 750px) {
  .qr {
    display: none;
  }
}

/* ================================================
pusher内部 上　タイトルと進む戻る
================================================ */
.title {
position: absolute;
 top: 15px;
left: 100px;
display: flex;
margin-right: 15px;
}

@media only screen and (min-width: 64.063em) {
}

@media only screen and (min-width: 1350px/*1050px*/) {
	.title {
	left: 0px;
	}
}



.title_page {
	display: block;
	height: 100px;
	width: 180px;
}
@media (max-width: 750px) {
	.title_page {
		width: 128px;		
	}
	.title_text {
	line-height: inherit;
	position: relative;
	font-size: 0.1rem;
/*	color: #C95673;/*A19*/
	}
}


.title_text  {
	line-height: inherit;
	position: relative;
	font-size: 0.2rem;
	color: #C95673;/*A19*/
	
}

@media (max-width: 750px) {
	.title_text {
	font-size: 0.1rem;
}	}



/* ================================================
link　進む戻る
================================================ */
/*
main + .pagination {
  margin: .5rem 0 0 0;
}
*/
.pagination {
  margin: 0 0 .2rem 0;
  line-height: 1;
	min-width:220px;
}

.pagination li {
  display: inline-block;
}

.pagination li + li {
  margin: 0 0 0 0rem;
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}

@media (max-width: 750px) {
  .pagination li + li {
    margin: 0 0 0 0rem;
  }
}

.pagination a {
  display: block;
  width: 70px;/*.4rem;*/
  height: 70px;/*.4rem;*/
  background: url("../img/common/pagination_previous_on.png") no-repeat center/100%;
  -webkit-transition: none;
  transition: none;
}

@media (max-width: 750px) {
  .pagination a {
    width: 54px;/*.6rem;*/;
    height: 54px;/*.6rem;*/;
  }
}

.pagination a:hover {
  background-image: url("../img/common/pagination_previous_off.png");
}
/*
.pagejump {
  margin: 0 auto .5rem auto;
  display: table;
  text-align: center;
}

@media (max-width: 750px) {
  .pagejump {
    font-size: .28rem;
  }
}

.pagejump li {
  margin: 0 1em 0 0;
  display: inline-block;
}

.pagejump li:last-child {
  margin-right: 0;
}

.pagejump a {
  padding: 0 0 0 1.2em;
  position: relative;
  color: #3F83A6/*元エメラルドグリーン#30cfc3;
}

.pagejump a::before {
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 1em;
  height: 1em;
  content: '';
  background: url("../img/common/pagejump_ic.svg") no-repeat center/100%;
}

.pagejump a:hover {
  color: #ffa800;
  text-decoration: underline;
}
*/
/* ================================================
pusher内部 下　ページ画像
================================================ */
.page_body {
	display: flex;
	width: 98%;
}
.page_body p {
	width: 90%; 
	height: 1800px; 
	margin: 100px auto;
	
/*	display: block;
	width:100%;
	height: auto;
	max-width:1280px;*/
}