@charset "UTF-8";

/*---------------------------------
  Google Fonts
---------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=BIZ+UDPGothic:wght@400;700&family=M+PLUS+Rounded+1c:wght@400;500;700;800&family=Noto+Sans+JP:wght@400;500;600;700&display=swap');

:root {
    --sp-design-base: 390;
    --sp: calc(100vw / var(--sp-design-base));
}

/* UD新ゴ系：注意事項・住所・問い合わせなど */
.BizUDPGothic {
    font-family: "BIZ UDPGothic", sans-serif;
}

/* UD新丸ゴ系：見出し・親しみのある部分 */
.MPLUSRounded {
    font-family: "M PLUS Rounded 1c", sans-serif;
}

/* 新ゴ系：ウェイトを細かく使う本文 */
.NotoSans {
    font-family: "Noto Sans JP", sans-serif;
}

/*---------------------------------
  表示・非表示（PC / TB / SP）
---------------------------------*/
.pconly {
	display: block;
}
.tbonly {
	display: block;
}
.sponly {
	display: none !important;
}
.pcnone {
	display: none;
}
@media screen and (max-width: 767px) {
.pconly {
	display: none !important;
}
.tbonly {
	display: none !important;
}
.sponly {
	display: block;
}
.pcnone {
	display: inline-block;
}
.spnone {
	display: none;
}
}

/*---------------------------------
  html/bodyの設定
---------------------------------*/
html {
	font-size: 62.5%; /* 62.5%は10px */
	font-family: 'Noto Sans JP', sans-serif;
    font-weight: 500;
}
body {
	color: #000000;
    background: #ffffff;
	overflow-x: hidden;
    word-break: break-all;
	font-feature-settings: "palt" 1, "trad" 1; /* 文字詰め（カッコや句読点など） */
    text-align: justify;
}
@media screen and (max-width: 767px) {
html {
	font-size: 62.5%; /* 62.5%は10px */
	font-family: 'Noto Sans JP', sans-serif;
    font-weight: 500;
}
body {
	color: #000000;
    background: #ffffff;
	overflow-x: hidden;
    word-break: break-all;
	font-feature-settings: "palt" 1, "trad" 1; /* 文字詰め（カッコや句読点など） */
    text-align: justify;
}
}

/*---------------------------------
  画像
---------------------------------*/
img {
	width:100%;
	height:auto;
}
picture {
    display: block;
}
#maincontentswrap01 img {
   vertical-align:bottom;
   pointer-events: none;
}
#maincontentswrap01 a img {
	border-style:none;
}
#maincontentswrap01 img {
	width:100%;
	height:auto;
	image-rendering: auto;
}
#maincontentswrap01 img[src$=".svg"] {
    width: 100%;
}


/*---------------------------------
  テキストリンク
---------------------------------*/
#maincontentswrap01 a:link {
	color: #000000;
	text-decoration: none;
	transition: 1.0s;
}
#maincontentswrap01 a:visited {
	color: #000000;
	text-decoration: none;
	transition: 1.0s;
}
#maincontentswrap01 a:active {
	color: #cb5486;
	text-decoration: none;
	transition: 1.0s;
}
#maincontentswrap01 a:hover {
	color: #cb5486;
	text-decoration: none;
	-webkit-filter: drop-shadow(0px 0px 5px rgba(203,84,134,0.8));
    filter: drop-shadow(0px 0px 5px rgba(203,84,134,0.8));
	transition: 1.0s;
}

/*---------------------------------
  画像リンク
---------------------------------*/
a img {
	display: block;
}

/* PNGボタン共通ドロップシャドウ */
.buttonshadow01 {
    filter: drop-shadow(3px 3px 3px rgb(0 0 0 / 50%));
}
@media screen and (max-width: 767px) {
.buttonshadow01 {
    filter: drop-shadow(
        calc(0.6882 * var(--sp))
        calc(0.6882 * var(--sp))
        calc(0.6882 * var(--sp))
        rgb(0 0 0 / 50%)
    );
}
}


/*---------------------------------
  アンカー位置設定
---------------------------------*/
#link01,
#link02,
#link03,
#link04,
#link05,
#link06,
#link07,
#link08,
#link09,
#link10 {
	margin: calc((1.0416666666666665vw + 4.6875vw + 1.0416666666666665vw) * -1) 0 0;
	padding: calc(1.0416666666666665vw + 4.6875vw + 1.0416666666666665vw) 0 0;
    position: absolute;
    z-index: 0;
}
@media screen and (max-width: 767px) {
#link01,
#link02,
#link03,
#link04,
#link05,
#link06,
#link07,
#link08,
#link09,
#link10 {
	margin: calc((1.3333333333333335vw + 7.199999999999999vw + 1.3333333333333335vw) * -1) 0 0;
	padding: calc(1.3333333333333335vw + 7.199999999999999vw + 1.3333333333333335vw) 0 0;
    position: absolute;
    z-index: 0;
}
}

/*---------------------------------
  フォントカラー
---------------------------------*/
.font-white01 { color: #ffffff; }
.font-blue01 { color: #2B457D; }
.font-black01 { color: #000000; }
.font-red01 { color: #c50018; }
.font-yellow01 { color: #fff338; }
.font-green01 { color: #00561f; }


/*---------------------------------
  テキスト頭揃え
---------------------------------*/
.indent00-05 {
    display: block;
	text-indent: -0.5em;
	padding: 0 0 0 0.5em;
}
.indent01-01 {
    display: block;
	text-indent: -1em;
	padding: 0 0 0 1em;
}
.indent01-05 {
    display: block;
	text-indent: -1.5em;
	padding: 0 0 0 1.5em;
}
.indent01-08 {
    display: block;
	text-indent: -1.8em;
	padding: 0 0 0 1.8em;
}

/*---------------------------------
  文字間調整用
---------------------------------*/
.letterspace01 {
	letter-spacing: -0.02em;
}

/*---------------------------------
  テキスト位置
---------------------------------*/
.textleft {
	text-align: left !important;
}
.textcenter {
	text-align: center !important;
}
.textright {
	text-align: right !important;
}
@media screen and (max-width: 767px) {
.textleft {
	text-align: left !important;
}
.textcenter {
	text-align: center !important;
}
.sptextcenter {
	text-align: center !important;
}
.textright {
	text-align: right !important;
}
}

/*---------------------------------
  テキスト太さ
---------------------------------*/
.textmedium {
	font-weight: 500;
}
.textbold {
	font-weight: 600;
}

/*---------------------------------
  タイトルアニメーション
---------------------------------*/
.glowAnime span { opacity: 0; }

/*アニメーションで透過を0から1に変化させtext-shadowをつける*/
.glowAnime.glow span { animation:glow_anime_on 3s ease-out forwards; }
@keyframes glow_anime_on {
	0% { opacity:0; text-shadow: 0 0 0 #fff,0 0 0 #fff; }
	50% { opacity:0.2; text-shadow: 0 0 10px #fff,0 0 15px #fff; }
	100% { opacity:1; text-shadow: 0 0 0 #fff,0 0 0 #fff; }
}

/*---------------------------------
  改行設定
---------------------------------*/
.break:before {
	content: "\A";
	white-space: pre;
}
.pcno-break:before {
	content: "";
	white-space: pre;
}
.spno-break:before {
	content: "\A";
	white-space: pre;
}
@media screen and (max-width: 767px) {
.break:before {
	content: "\A";
	white-space: pre;
}
.pcno-break:before {
	content: "\A";
	white-space: pre;
}
.spno-break:before {
	content: "";
	white-space: pre;
}
}

/*---------------------------------
  ローディング
---------------------------------*/
#splash {
	position: fixed;
	width: 100%;
	height: 100%;
    background:
    url('../img/contentsbg01_pc.png') repeat right top / 100% auto,
    #ffff00;
	z-index: 999999;
	text-align: center;
	color: #fff;
}

#splash-logo {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

/* Loading アイコンの大きさ設定 */
#splash-logo img {
	width: 100%;
}

/*画面遷移アニメーション*/
/*画面遷移の後現れるコンテンツ設定*/
#wrapper{
	opacity: 0;/*はじめは透過0に*/
}

/*bodyにappearクラスがついたら出現*/
body.appear #wrapper{
	animation-name:PageAnimeAppear;
	animation-duration:1s;
	animation-delay:0.2s;
	animation-fill-mode:forwards;
	opacity: 0;
}

@keyframes PageAnimeAppear{
0% {
	opacity: 0;
}
100% {
	opacity: 1;
}
}
@media screen and (max-width: 767px) {
#splash {
	position: fixed;
	width: 100%;
	height: 100%;
    background:
    url('../img/contentsbg01_sp.png') repeat right top / 100% auto,
    #ffff00;
    background:
    url('../img/contentsbg01_sp.png') repeat right top / 100% auto,
    #ffff00;
	z-index: 999999;
	text-align: center;
	color: #fff;
}

#splash-logo {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
/* Loading アイコンの大きさ設定 */
#splash-logo img {
	width: 100%;
}
}


/*---------------------------------
  メインビジュアル
---------------------------------*/
#mainvisualwrap01 {
    width: 100%;
}
@media screen and (max-width: 767px) {
#mainvisualwrap01 {
    width: 100%;
}
}


/*---------------------------------
  メインコンテンツ
---------------------------------*/
#maincontentswrap01 {
	width: 100%;
    font-size: 2.0rem;
    line-height: 180%;
    background:
    url('../img/contentsbg01_pc.png') repeat right top / 100% auto,
    #ffff00;
}
#maincontentswrap02 {
	width: 100%;
	margin: 0 auto;
}
#maincontentswrap03 {
	width: 100%;
    background:#ffffff;
    padding: 27px 0 0;
}
@media screen and (max-width: 767px) {
#maincontentswrap01 {
	width: 100%;
    font-size: calc(14 * var(--sp));
    line-height: 180%;
    background:
    url('../img/contentsbg01_sp.png') repeat right top / 100% auto,
    #ffff00;
}
#maincontentswrap02 {
	width: 100%;
	margin: 0 auto;
}
#maincontentswrap03 {
	width: 100%;
    background: #ffffff;
    padding: calc(30 * var(--sp)) 0 0; 
}
}


/*---------------------------------
  コンテンツ（共通）
---------------------------------*/
.contentswrap01 {
	width: 100%;
	padding: 0 0 55px;
    position: relative;
}
.contentswrap01:after {
	content: "";
	clear: both;
	display: block;
}
.contentswrap01 img {
	display: block;
	width: 100%;
	height: auto;
}
.contentswrap02 {
	width: 100%;
	padding: 0 0 15px;
    position: relative;
}
.contentswrap02:after {
	content: "";
	clear: both;
	display: block;
}
.contentswrap02 img {
	display: block;
	width: 100%;
	height: auto;
}
.contentspurplewrap01 {
	display: block;
	width: 100%;
    padding: 60px 0;
    background: #674291;
}
.contentspinkwrap01 {
	display: block;
	width: 100%;
    padding: 60px 0;
    background: #cb5486;
}
.contentsinner01 {
    width: 900px;
    max-width: 96%;
    margin: 0 auto;
    padding: 0 0 45px;
}
.contentsinner01:last-child {
    padding: 0;
}
.contentsinner02 {
    width: 800px;
    max-width: 96%;
    margin: 0 auto;
    padding: 0 0 45px;
}
.contentsinner02:last-child {
    padding: 0;
}

.contentswhitewrap01 {
    width: 100%;
    margin: 30px 0 0;
    padding: 45px 50px;
    background: #ffffff;
    position: relative;
}
.contentswhitewrapinner01 {
    width: 100%;
    padding: 0 0 45px;
}
.contentswhitewrapinner01:last-child {
    padding: 0;
}
.contentswhitewrapinner02 {
    width: 100%;
    padding: 0 0 5px;
}
.contentswhitewrapinner02:last-child {
    padding: 0;
}

.contentsbuttonwrap01 {
    width: 100%;
    margin: 0 auto;
    padding: 0 0 45px;
}
.contentsbuttonwrap01:last-child {
    padding: 0;
}
@media screen and (max-width: 767px) {
.contentswrap01 {
	width: 100%;
	padding: 0 0 calc(30 * var(--sp));
    position: relative;
}
.contentswrap01:after {
	content: "";
	clear: both;
	display: block;
}
.contentswrap01 img {
	display: block;
	width: 100%;
	height: auto;
}
.contentswrap02 {
	width: 100%;
	padding: 0 0 calc(15 * var(--sp));
    position: relative;
}
.contentswrap02:after {
	content: "";
	clear: both;
	display: block;
}
.contentswrap02 img {
	display: block;
	width: 100%;
	height: auto;
}
.contentspurplewrap01 {
	display: block;
	width: 100%;
    padding: calc(15 * var(--sp)) 0;
    background: #674291;
}
.contentspinkwrap01 {
	display: block;
	width: 100%;
    padding: calc(15 * var(--sp)) 0;
    background: #cb5486;
}
.contentsinner01 {
    width: calc(350 * var(--sp));
    max-width: calc(350 * var(--sp));
    margin: 0 auto;
	padding: 0 0 calc(18 * var(--sp));
}
.contentsinner01:last-child {
    padding: 0;
}
.contentsinner02 {
    width: calc(350 * var(--sp));
    max-width: calc(350 * var(--sp));
    margin: 0 auto;
	padding: 0 0 calc(18 * var(--sp));
}
.contentsinner02:last-child {
    padding: 0;
}

.contentswhitewrap01 {
    width: 100%;
    margin: calc(15 * var(--sp)) 0 0;
    padding: calc(25 * var(--sp));
    background: #ffffff;
    position: relative;
}
.contentswhitewrapinner01 {
    width: 100%;
	padding: 0 0 calc(18 * var(--sp));
}
.contentswhitewrapinner01:last-child {
    padding: 0;
}
.contentswhitewrapinner02 {
    width: 100%;
	padding: 0 0 calc(10 * var(--sp));
}
.contentswhitewrapinner02:last-child {
    padding: 0;
}

.contentsbuttonwrap01 {
    width: 100%;
	padding: 0 0 calc(18 * var(--sp));
}
.contentsbuttonwrap01:last-child {
    padding: 0;
}
}


/*---------------------------------
  画像タイトル
---------------------------------*/
.imgtitle01 { 
    margin: -80px 0 0;
}
@media screen and (max-width: 767px) {
.imgtitle01 { 
    margin: calc(-40 * var(--sp)) 0 0;
}
}


/*---------------------------------
  お知らせ
---------------------------------*/
.newswrap01 {
    height: 150px;
    overflow-y: scroll;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    padding: 8px 15px;
    font-size: 1.8rem;
    line-height: 160%;
    scrollbar-color: #c9c9c9 #f2f2f2;
    scrollbar-width: thin;
}
.newswrap01::-webkit-scrollbar {
    width: 10px;
}
.newswrap01::-webkit-scrollbar-track {
    background: #f2f2f2;
}
.newswrap01::-webkit-scrollbar-thumb {
    min-height: 30px;
    border: 2px solid #f2f2f2;
    border-radius: 10px;
    background: #c9c9c9;
}
.newswrap01:focus-visible {
    outline: 2px solid #674291;
    outline-offset: 3px;
}
.newslist01 li {
    display: grid;
    grid-template-columns: 90px 50px 1fr;
    align-items: baseline;
    padding: 4px 0;
    /* border-bottom: 1px dotted #c9c9c9; */
}
.newslist01 li:last-child {
    border-bottom: 0;
}
.newslist01 time {
    grid-column: 1;
}
.newsnew01 {
    grid-column: 2;
}
.newstext01 {
    grid-column: 3;
}
.newslist01 time,
.newsnew01 {
    white-space: nowrap;
}
.newsnew01 {
    color: #e83942;
}
@media screen and (max-width: 767px) {
.newswrap01 {
    height: calc(75 * var(--sp));
    padding: 0 calc(5 * var(--sp));
    font-size: calc(11 * var(--sp));
    line-height: 150%;
}
.newswrap01::-webkit-scrollbar {
    width: calc(8 * var(--sp));
}
.newslist01 li {
    grid-template-columns:
        calc(55 * var(--sp))
        calc(32 * var(--sp))
        1fr;
    padding: calc(5 * var(--sp)) 0;
}
}


/*---------------------------------
  リスト
---------------------------------*/
.contentsattentionwrap01 {
    width: 800px;
    margin: 0 auto;
}
ul.attentionlist01 {
    display: block;
    padding: 0 0 50px;
}
ul.attentionlist01:last-child {
    padding: 0;
}
ul.attentionlist01 li {
    display: block;
    font-size: 20px;
    font-weight: 600;
}
ul.attentionlist01 li.attentiontitle01 {
    font-size: 40px;
    font-weight: 600;
    text-align: center;
    padding: 0 0 0.5em;
}
.attentionsubtitle01 {
    font-size: calc(40px * 0.8);
}

ul.contactlist01 {
    display: table;
    margin: 0 auto;
    padding: 0 0 50px;
}
ul.contactlist01 li {
    display: block;
    font-size: 30px;
    font-weight: 500;
    line-height: 160%;
    letter-spacing: -0.05em;
}
.contactsubtitle01 {
    font-size: calc(30px * 0.8);
}
@media screen and (max-width: 767px) {
.contentsattentionwrap01 {
    width: 100%;
    margin: 0 auto;
}
ul.attentionlist01 {
    display: block;
    padding: 0 0 30px;
}
ul.attentionlist01:last-child {
    padding: 0;
}
ul.attentionlist01 li {
    display: block;
    font-size: calc(8 * var(--sp));
    font-weight: 600;
    line-height: 180%;
}
ul.attentionlist01 li.attentiontitle01 {
    font-size: calc(12 * var(--sp));
    font-weight: 600;
    text-align: center;
    padding: 0 0 0.5em;
}
.attentionsubtitle01 {
    font-size: calc(12 * var(--sp) * 0.8);
}

ul.contactlist01 {
    display: table;
    margin: 0 auto;
    padding: 0 0 30px;
}
ul.contactlist01 li {
    display: block;
    font-size: calc(12 * var(--sp));
    font-weight: 500;
    line-height: 160%;
    letter-spacing: -0.05em;
}
.contactsubtitle01 {
    font-size: calc(12 * var(--sp) * 0.8);
}
}


/*---------------------------------
  リンク無効
---------------------------------*/
.nolink01 {
    pointer-events: none;
}
