@charset "utf-8";
#subpage {
    clear:both; width:100%;
    background-image: url("../../img/shabon_bg2.png"), url("../../img/shabon_bg1.png");
    background-repeat: no-repeat, no-repeat;
    background-position: right 30%, left 80%;
}
@media only screen and (max-width:768px){
    #subpage { background-size: 180px auto, 200px auto;}
}


/*---------------------------------------------------------------------------
  PAN
---------------------------------------------------------------------------*/
.pan {
	clear:both;
	margin:0;
	padding: 0.5%;
	font-size: 80%;
	color: #666;
	text-align:right;
}
.pan a {color: #666; text-decoration:none;}
.pan a:hover {color: #333333;}



/*====================================================================================================
  SUBPAGE
====================================================================================================*/
h1.tit  {
    font-family: "Kiwi Maru", serif;
    font-size: 287.5%;
    text-align: center;
    color:#12A4B2;
    background:rgba(211,241,198,0.35) url("../../img/h1_bg.png") repeat-x bottom center;
    
    line-height:1.2em;
}
h1.tit span {
    position: relative;
    display: block;
    margin: auto;
    padding:80px 0 100px;
    width: 100%; max-width: 1100px;
}
h1.tit span::before,
h1.tit span::after {
    position: absolute;
    display: block; clear: both; content:"";
    background-size: 100% auto !important;
}
h1.tit span::before {
    top: -80px; right: -50px;
    width: 132px; height: auto; aspect-ratio: 132 / 213;
    background: url("../../img/kazari01.png") no-repeat;
}
h1.tit span::after {
    bottom: -30px; left: -50px;
    width: 159px; height: auto; aspect-ratio: 159 / 202;
    background: url("../../img/kazari02.png") no-repeat;
}
h1.tit2  {
    padding:60px 20px;
    font-size: 287.5%;
    text-align: center;
    color:#33B9B1;
    background:#F7F5F6;
}
@media only screen and (max-width:768px){
    h1.tit { font-size: 200%; background-size: 100% auto;}
    h1.tit span { padding:40px 0;}
    h1.tit span::before,
    h1.tit span::after { width:60px;}
    h1.tit span::before { top:-50px; right:0;}
    h1.tit span::after { bottom:-20px; left:10px;}
    h1.tit2 {
        padding:40px 20px;
        font-size: 200%;
    }
}



/*---------------------------------------------------------------------------
  PAN and DATA
---------------------------------------------------------------------------*/
#page_data {
    display: flex; flex-wrap: wrap; justify-content: space-between;
    margin:0 auto; padding: 20px 0 10px;
    width: 90%; max-width: 1100px;
}
#page_data .pan { 
    display: flex; flex-wrap: wrap;
    width: 100%;
    font-size: 75%;
}
/* #page_data .pan li + li::before { padding:  0 10px; content:"-";} */
#page_data .pan li + li::before { padding:  0 10px;}
#page_data .pan a { color:#444; text-decoration: underline;}



/*---------------------------------------------------------------------------
  PAGE LIST
---------------------------------------------------------------------------*/
#subpage .list_cont h2 { color: #fff !important; background: #6FD2DC !important;}
#subpage .list_cont h3 { margin: 0 !important;}
#subpage .list_set + .list_set { margin-top: 80px;}
#subpage .column { overflow: hidden;}
#subpage .column .col1 { float: left; margin: 0 2% 40px; width: 96%;}
#subpage .column .col2 { float: left; margin: 0 2% 40px; width: 46%;}
#subpage .column ＋ h3.mid1 { clear: both;}
#subpage .list { padding: 30px 20px; background: rgba(194,235,250,0.15); overflow: hidden;}
#subpage .list p { margin: 0 2% 10px !important;}
#subpage .list p.col2 { float: left; width: 46%;}
#subpage .list p + p { margin-top: 10px;}
#subpage .list p a {
    display: block;
    padding:  0 0 0 25px;
    color: #222;
    text-decoration:none;
    background:url("../img/arrow_b.svg") no-repeat left 5px;
    background-size:15px auto;
}
@media only screen and (min-width:768px){
    #subpage .list p a:hover { text-decoration: underline;}
}
@media only screen and (max-width:768px){
    #subpage .column .col2 { float: none; width: 96%;}
    #subpage .column .col2 + .col2 { margin-top: 40px;}
    #subpage .list p.col2 { float:none; width:96%;}
}



/*---------------------------------------------------------------------------
  TITLE
---------------------------------------------------------------------------*/
#subpage h2 {
    position: relative;
	clear:both;
/*    margin:  0 0 60px; */
    margin:  40px 0 20px;
	padding: 30px;
    font-family: "Kiwi Maru", serif;
	font-size:162.5%;
	font-weight: 600;
    color: #222;
	background: #F7F8C4;
    background-size: auto 100%;
	border-radius:25px;
}
#subpage h2 span { margin-right: 15px; font-size: 20px;color:#fff;}
#subpage h2::before,
#subpage h2::after {
    position: absolute;
    display: block; clear: both; content:"";
    background-size: 100% auto !important;
    mix-blend-mode:multiply;
}
#subpage h2::before {
    bottom: -20px; right: -20px;
    width: 70px; height: auto; aspect-ratio: 108 / 116;
    background:url("../../img/kazari03.png") no-repeat;
    transform: rotate(80deg);
}
#subpage h2::after {
    top: -40px; left: -15px;
    width: 50px; height: auto; aspect-ratio: 177 / 340;
    background:url("../../img/kazari06.png") no-repeat;
    
}
#subpage h3 {
	clear:both;
/*    margin: 0 2% 40px; */
    margin: 0 0 40px;
    padding: 0 0 30px 60px;
    font-family: "Kiwi Maru", serif;
	font-size:137%;
	font-weight: 500;
    background: url("../../img/h3_bg.png") no-repeat 15px top;
	border-bottom:3px solid #6FD2DC;
}
#subpage h4 {
	clear:both;
/*	margin:0 2% 20px; */
	margin:0 0 20px;
    font-family: "Kiwi Maru", serif;
	font-size:125%;
	font-weight: 600;
    color:#12A4B2;
}
#subpage h4.cb { margin: 0 0 20px; color: #222;}
@media only screen and (max-width:768px){
    #subpage h2 { padding:30px 20px; font-size:150%;}
    #subpage h2::before { bottom:-20px; right:0; width:50px;}
    #subpage h2::after { top:-30px; left:0; width:40px;}    
}



/*---------------------------------------------------------------------------
  DATA
---------------------------------------------------------------------------*/
#subpage .data { margin: 0 2% 60px; text-align: right;}
/* #subpage .data span + span::before { padding: 0 20px; content:"／";} */
#subpage .data span + span::before { padding: 0 20px;}
@media only screen and (max-width:768px){
    #subpage .data { font-size: 87.5%; text-align: left;}
}



/*---------------------------------------------------------------------------
  COMMENT
---------------------------------------------------------------------------*/
#subpage .comment {
	margin:0 2% 60px;
    line-height:200%;
}
#subpage .notes { padding-left: 20px; text-indent: -20px; font-size: 87.5%;}
/* #subpage .notes::before { margin-right: 5px; content:"※";}*/
#subpage .notes::before { margin-right: 5px;}



/*---------------------------------------------------------------------------
  PHOTO
---------------------------------------------------------------------------*/
#subpage .photo { position: relative; max-width:460px; text-align:center;}
#subpage .photo img { width: auto; max-width: 100%;}
#subpage .photo .cap { font-size:80%; text-align:center;}
#subpage .photo .pic + .cap { margin-top: 10px;}
#subpage .photo .cap + .pic { margin-top: 30px;}
#subpage .photo.pic_l { float: left; margin-right: 40px; max-width:calc(50% - 40px);}
#subpage .photo.pic_r { float: right; margin-left: 40px; max-width:calc(50% - 40px);}
#subpage .photo.pic_c { float: none; width: 100%; max-width:100%;}
@media only screen and (max-width:768px){
    #subpage .photo,
    #subpage .photo .pic { width: 100% !important; max-width:100% !important;}
    #subpage .photo.pic_l,
    #subpage .photo.pic_r,
    #subpage .photo.pic_c { float: none; margin:0 0 20px; }
}



/*---------------------------------------------------------------------------
  LIST
---------------------------------------------------------------------------*/
/* #subpage ul { clear:both; margin: 0 2% 60px;}*/
#subpage ul { clear:both; margin: 0 2% 0;}
#subpage ul li { position:relative; padding-left: 25px;}
#subpage ul li + li { margin-top: 10px;}
#subpage ul li::before {
    display: block; clear: both; content:"";
    position: absolute; top:8px; left:2px;
    width: 10px; height: 10px;
    background:#6FD2DC;
    border-radius: 15px;
}
#subpage ol { clear:both; margin: 0 2% 0; padding-left: 23px;}
#subpage ol li + li { margin-top: 10px;}
#subpage ol li { list-style-type: decimal;}



/*---------------------------------------------------------------------------
  HYOU
---------------------------------------------------------------------------*/
#subpage table {
    clear:both; 
/*    margin: 0 2% 60px; */
/*    width: 96%; */
	border:1px solid #ddd;
	border-collapse:collapse;
}
#subpage table th,
#subpage table td {
    padding:7px 15px;
	border:1px solid #ddd;
}
#subpage table th {
/*    width: 270px; */
    text-align: center;
    font-weight: normal;
    background:rgba(211,241,198,0.26);
}
/*
@media only screen and (max-width:768px){
    #subpage table { margin:0 2%; width:96%; table-layout:auto;}
    #subpage table th,
    #subpage table td{
        table-layout:auto !important;
        display:block !important;
        width:90% !important;
        height:auto !important;
    }
    #subpage table th{ padding:2% 5% !important;}
    #subpage table td{ padding:2% 5% !important;}

}
*/


/*---------------------------------------------------------------------------
  LINK
---------------------------------------------------------------------------*/
#subpage .icon-pdf,
#subpage .icon-word,
#subpage .icon-excel,
#subpage .icon-link { position: relative; margin: 0 2%; padding: 5px 0 5px 25px;}
#subpage .icon-pdf { background: url(../img/icon-pdf.jpg) no-repeat left 7px;}
#subpage .icon-word { background: url(../img/icon-word.jpg) no-repeat left 7px;}
#subpage .icon-excel { background: url(../img/icon-excel.jpg) no-repeat left 7px;}
#subpage .icon-link{ background:url("../img/arrow_b.svg") no-repeat left 10px; background-size:15px auto;}



/*---------------------------------------------------------------------------
  BOX
---------------------------------------------------------------------------*/

/* BOX1 */
#subpage .box1 { clear:both; margin: 0 2% 60px; overflow: hidden;}
#subpage .box1 .comment { margin:0;}

/* BOX2 */
#subpage .box2 { clear:both; margin: 0 2% 60px; padding:40px; border: 5px solid #F7F8C4; overflow: hidden;}
#subpage .box2 h3 { clear: none; margin: 20px 0; padding: 0; color: #12A4B2; border: none;}
#subpage .box2 .comment { margin:0; }

/* BOX3 */
#subpage .box3 { clear:both; margin: 0 2% 60px; padding:40px; background: rgba(211,241,198,0.25); overflow: hidden;}
#subpage .box3 .comment { margin:0;}

/* BOX4 */
#subpage .box4 { overflow:hidden;}
#subpage .box4 .box {
    float: left; 
    margin: 0 2% 60px;
    width: 46%;
    padding:30px;
    background:rgba(194,235,250,0.25);
}
#subpage .box4 h4 { margin: 0 0 20px; padding-bottom: 20px; color: #33B9B1; border-bottom: 2px solid #33B9B1;}
#subpage .box4 .comment { margin: 0 0 20px; }
#subpage .box4 .photo { margin: 0 0 20px; }
#subpage .box4 .btn a:hover { opacity: 0.7; }
@media only screen and (max-width:768px){
    #subpage .box1 { display: flex; flex-direction:column-reverse; gap:40px;}
    #subpage .box2 { display: flex; flex-direction:column-reverse; gap:40px; padding: 20px;}
    #subpage .box3 { display: flex; flex-direction:column-reverse; gap:40px; padding: 20px;}
    #subpage .box4 .box { float: none; padding:30px 20px; width: 100%;}
}


/*---------------------------------------------------------------------------
  BOTTON
---------------------------------------------------------------------------*/
#subpage .btn_box {overflow: hidden;}
#subpage .btn_box p { float: left; margin: 0 2% 20px;}
#subpage .btn a {
    position: relative;
    display: block;
    padding: 15px 30px 15px 15px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    font-weight: 500;
    background:#6FD2DC url("../img/arrow_w.svg") no-repeat 95% center;
    background-size:15px auto;
    border-radius:10px;
    box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.15);
}
#subpage .btn a span {
    padding-left: 30px;

}
#subpage .btn.b1 { float:none; clear: both; margin: 0 auto 20px; width: 100%; max-width:660px;}
#subpage .btn.b2 { width: calc(50% - 4%);}
#subpage .btn.b3 { width: calc(33.3% - 4%);}
#subpage .btn.b4 { width: calc(25% - 4%);}
#subpage .btn.b1 a { background-position:97% center;}
#subpage .btn.b2 a { background-position:95% center;}
#subpage .btn.b3 a { background-position:93% center;}
#subpage .btn.b4 a { background-position:91% center;}
@media only screen and (min-width:768px){
    #subpage .btn a:hover { opacity: 0.7;}
}
@media only screen and (max-width:768px){
    #subpage .btn { float: none; margin:0 2% 20px; width: 96% !important;  max-width:none !important;}
    #subpage .btn a { background-position:97% center !important; text-align: left;}
}


/*---------------------------------------------------------------------------
  PHOTO BOX 
---------------------------------------------------------------------------*/
#subpage .gallery { clear: both; overflow: hidden;}
#subpage ul.photo_box { clear: none; float: left; margin: 0 2% 40px;}
#subpage ul.photo_box li { margin:0; padding: 0; list-style: none; background: none;}
#subpage ul.photo_box li::before { display: none;}
#subpage ul.photo_box li.photo { margin:0 0 10px; max-width: none;}
#subpage ul.photo_box li.cap { line-height: 150%;}
#subpage ul.photo_box li.youtube { margin:0 0 10px; position: relative;}
#subpage ul.photo_box li.youtube iframe {
	position: absolute; top: 0; right: 0;
    width: 100% !important;
	height: 100% !important;
}
/* PHOTO BOX1 */ #subpage ul.g1 {width:96%; float:none; clear:both; }
/* PHOTO BOX2 */ #subpage ul.g2 {width:calc(50% - 4%);}
/* PHOTO BOX3 */ #subpage ul.g3 {width:calc(33.3% - 4%);}
/* PHOTO BOX4 */ #subpage ul.g4 {width:calc(25% - 4%);}
/* PHOTO BOX5 */ #subpage ul.g5 {width:calc(20% - 4%);}
#subpage ul.photo img { width: 100%; max-width:1000px; height:auto;}
@media only screen and (max-width:768px){
   #subpage ul.photo_box {width:98%; float:none; clear:both; }
}



/*---------------------------------------------------------------------------
  CONTACT
---------------------------------------------------------------------------*/
#subpage .contact {
    position: relative;
    display: flex; flex-wrap: wrap; justify-content: space-between; gap:20px 40px;
    clear:both;
    padding: 25px 50px;
    background: rgba(194,235,250,0.40);
    border-radius: 20px;
}
#subpage .contact::before {
    position: absolute; top:-70px; left:-80px;
    display: block; clear: both; content:"";
    width: 126px; height: auto; aspect-ratio: 126 / 151;
    background: url("../../img/kazari10.png") no-repeat;
    background-size: 100% auto;
}
#subpage .contact h5 { margin-bottom:10px}
#subpage .contact .come {}
#subpage .contact .btn { margin: 0; width: 400px;}
@media only screen and (min-width:768px){
    #subpage .contact .b_link a:hover { opacity: 0.7;}
}
@media only screen and (max-width:768px){
    #subpage .contact { padding:50px 30px;}
    #subpage .contact .come { flex-direction: column;}
    #subpage .contact::before { top:-70px; left:-30px; width:90px;}
    #subpage .contact .btn { margin: 0; width:100%;}
}



/*---------------------------------------------------------------------------
  LINE
---------------------------------------------------------------------------*/
#subpage .line { margin:40px auto; width:100%; max-width: 1000px;}
#subpage .line hr { margin: 0; padding: 0; height: 2px;  background:#33B9B1; border: none;}


/* 20250724 add */
#subpage .inner {
	font-size:120%;
	line-height:1.5em;
}

#subpage .inner p{
	margin-bottom:20px;
}

#subpage .inner table td p,
#subpage .inner table th p{
	margin-bottom:0px;
}
.image_left {
	float: left;
	margin:5px;
}
.image_center {
	float: none;
	margin:5px;
	text-align:center;
}
.image_right {
	float: right;
	margin:5px;
}
#subpage img{
	max-width:100%;
}


.text_r {
	text-align:right;
	margin-bottom:20px;
	width:1100px;
	max-width:100%;
	margin-right:auto;
	margin-left:auto;
}



#get_pdf {
	border-top:2px solid #CCC;
	padding-top:10px;
	
}

#get_pdf img {
	float:left;
	margin-right:20px;
}

.hissu{
	color:#FF0000;
}