/*　-------------------------------------------------- ------------------------------------------------------ ------------------------------------------------------ 113 ファンゾーン -------------------------------------------------- */ .download_content02_left, .download_content02_right{margin-bottom:20px;} .download_content03{width:23%;margin:0 2% 60px 0;} .download_content03:nth-child(4n){margin:0 0 30px 0;} .download_content03, .download_content03 p, .download_content03 img{vertical-align:top;display:inline-block;} .download_content03 img{border:#dadada solid 1px;} .download_content03 .btn_post{margin:10px 0;} .download_content03 p{display:block;} .download_content03 p.download_text02{height:50px;margin:10px 0;font-size:12px!important;} .download_content03 .btn_post{width:100%;} @media screen and (max-width:690px){ .download_content03{width:48%;margin:0 2% 50px 0;} .download_content03:nth-child(2n){margin:0 0 50px 0;} } /*　-------------------------------------------------- ------------------------------------------------------ ------------------------------------------------------ フォトギャラリー -------------------------------------------------- */ .photo_gallery{} .photo_gallery .content_main .thumbs_list ul li{width:241px;margin:0 1px 1px 0;display:inline-block;cursor:pointer;} .photo_gallery .content_main .thumbs_list ul li:nth-child(3n){margin-right:0;} .photo_gallery .content_main .thumbs_list ul li:hover{opacity:.75;} .photo_gallery .content_main .thumbs_list ul li .img{width:100%;height:auto;} .photo_gallery .content_main .thumbs_list ul li .img img{width:100%;height:auto;} @media screen and (max-width:1100px){ .photo_gallery .content_main .thumbs_list ul li{width:32%;margin:0 1% 1% 0;} } @media screen and (max-width:560px){ .photo_gallery .content_main .thumbs_list ul li{width:100%;margin:0 0 4% 0;} } /*　-------------------------------------------------- ------------------------------------------------------ ------------------------------------------------------ 2021年追加 -------------------------------------------------- */ /*　-------------------------------------------------- ------------------------------------------------------ 画面幅850px -------------------------------------------------- */ .contents.col_2 .inner .content .content_left {float: left; position: relative; width: 850px; height: auto; padding: 0 0 30px 0; text-align: center; display: inline-block;} .contents.col_2 > .inner { width: auto;} @media screen and (max-width: 690px){ .contents.col_2 .inner .content .content_left { float: none; width: 100%; height: auto;} } /*　-------------------------------------------------- ------------------------------------------------------ -------------------------------------------------- */ .contents.col_2.post .inner .content .content_left .post_inner .table{width: 100%} .contents.col_2.post .inner .content .content_left .post_inner .table th { font-size: 14px; vertical-align: middle; text-align: center; background: #f5f5f5; border-right: 1px solid #e5e5e5;} .contents.col_2.post .inner .content .content_left .post_inner .table .red { color:#ad0040} .contents.col_2.post .inner .content .content_left .post_inner .table .bold{ font-weight: bold} .contents.col_2.post .inner .content .content_left .post_inner .table td {line-height: 1.5;padding: 7px 5px; vertical-align: middle; background: #fff; border-right: 1px solid #e5e5e5;} .contents.col_2.post .inner .content .content_left .post_inner .table tr { border: 1px solid #e5e5e5;} .contents.col_2.post .inner .content .content_left .post_inner .table .nowrap { min-width:80px} .price{text-align: right;vertical-align: middle;} @media screen and (max-width: 1100px){ .contents.col_2.post .inner .content .content_left .post_inner .table td { line-height: 1.4; padding: 7px 2px; vertical-align: middle; background: #fff; border-right: 1px solid #e5e5e5; } .contents.col_2.post .inner .content .content_left .post_inner .table th { font-size: 1.1rem; vertical-align: middle; text-align: center; background: #f5f5f5; border-right: 1px solid #e5e5e5; padding: 7px 2px; } } /*　-------------------------------------------------- ------------------------------------------------------ アコーディオン -------------------------------------------------- */ .accbox { padding: 0; max-width:100%} .accbox label { display: block; padding: 10px; color: #ad0040; cursor :pointer; transition: all 0.5s;} .accbox input { display: none;} .accbox .accshow { height: 0; padding: 0; overflow: hidden; opacity: 0; transition: 0.8s;} .cssacc:checked + .accshow { height: auto; padding: 2%; background: #fff;opacity: 1;} /*　-------------------------------------------------- ------------------------------------------------------ 質問 -------------------------------------------------- */ .cp_actab { position: relative; overflow: hidden; width: 100%; margin: 0 auto; color: #ffffff;} .cp_actab input { position: absolute; z-index: -1; opacity: 0;} .cp_actab label { font-weight: bold; line-height: 3; position: relative; display: block; padding: 0 0 0 1em; cursor: pointer; margin: 0 0 1px 0; color:#333333;} .cp_actab .cp_actab-content { overflow: hidden; max-height: 0; -webkit-transition: max-height 0.35s; transition: max-height 0.35s; color: #333333; background: #f8f8f8;} .cp_actab .cp_actab-content p { margin: 1em;} /* :checked */ .cp_actab input:checked ~ .cp_actab-content { max-height: 35em; } /* Icon */ .cp_actab label::after { line-height: 3; position: absolute; top: 0; right: 0; display: block; width: 3em; height: 3em; -webkit-transition: all 0.35s; transition: all 0.35s; text-align: center;} .cp_actab input[type=checkbox] + label::after { content: '+';} .cp_actab input[type=checkbox]:checked + label::after { transform: rotate(315deg);} @media screen and (max-width: 690px){ .cp_actab label { font-weight: bold; line-height: 2; position: relative; display: block; padding: 0 0 0 1em; cursor: pointer; margin: 0 0 15px 0; color: #333333; padding-right: 15%;}} /*　-------------------------------------------------- ------------------------------------------------------ ボランティア募集ページ -------------------------------------------------- */ .contents.col_2.post .inner .content .content_left .post_inner img { max-width: 100%; margin: 5px;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents h3 {color: #ad0040; font-size: 2rem; line-height: 1.4em; font-weight: 600; display: block; width: 100%;background: #fff; padding: 0;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents p {font-size: 1.25rem} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents .volunteer_dl dt{font-size: 1.4rem; display: inline-block; background-color: #ad0040; padding: 0.43em 1em 0.4em 1em; line-height: 1; color: #fff; margin-bottom: 0.6em; margin-top: 1.8em; border-radius: 0.9em;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents .volunteer_dl dd{font-size: 1.4rem; line-height: 1.2; margin-bottom: 0.5em; position: relative; padding-left: 1.25em; text-indent: -1.25em;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents .volunteer_dl dd:before {content: " ";display: inline-block; width: 0.7em; height: 0.7em; background-color: #FFD5EC; border-radius: 0.35em; position: relative; top: 0em; margin-left: 0.2em; margin-right: 0.5em;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents h4 {padding-top: 80px; font-size: 2.4rem; line-height: 1.4em; font-weight: bold; color: #ad0040; text-align: center; border-left: 0;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents p.schedule_text{font-size: 2rem; text-align: center; font-weight: 500; line-height: 1; color: #ad0040; margin-bottom: 50px;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents .schedule_list dt {font-size: 1.4rem; display: block; background-color: #ad0040; padding:15px 10px; line-height: 1; color: #fff; margin-bottom: 0.6em; margin-top: 1.8em;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents .schedule_list .schedule_inner{padding: 10px;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents .schedule_list .schedule_inner p{margin-bottom: 30px;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents .schedule_list .img_list{display: flex;flex-wrap: nowrap;justify-content: flex-start;align-items: stretch; margin: 10px 0;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents .schedule_list .img_list li{ width: 50%;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents .schedule_list .img_list img {width: 375px;margin: 5px;} .contact_btn {position: relative;margin: 20px 0;background: #ad0040;text-decoration: none;border-radius: 4px;-webkit-border-radius: 4px; -moz-border-radius: 4px;text-align: center;display: inline-block;text-decoration: none;} .contact_btn a {padding: 14px; color: #FFF!important; font-size: 14px; line-height: 1.4em; font-weight: bold; display: inline-block; text-decoration: none;} @media screen and (max-width: 690px){ .contents.col_2.post .inner .content .content_left .post_inner img { max-width: 100%; margin: 0px;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents h3 {color: #ad0040; font-size: 1.6rem; line-height: 1.4em; font-weight: 600; display: block; width: 100%;background: #fff; padding: 0;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents h4 {padding-top: 50px; font-size: 2rem; line-height: 1.4em; font-weight: bold; color: #ad0040; text-align: center; border-left: 0;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents p.schedule_text{font-size: 1.2rem; text-align: center; font-weight: 500; line-height: 1; color: #ad0040; margin-bottom: 30px;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents p {font-size: 1.2rem} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents .volunteer_dl dt{font-size: 1.2rem; display: inline-block; background-color: #ad0040; padding: 0.43em 1em 0.4em 1em; line-height: 1; color: #fff; margin-bottom: 0.6em; margin-top: 1.8em; border-radius: 0.9em;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents .volunteer_dl dd{font-size: 1.2rem; line-height: 1.2; margin-bottom: 0.5em; position: relative; padding-left: 1.25em; text-indent: -1.25em;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents .schedule_list dt {font-size: 1.2rem; display: block; background-color: #ad0040; padding:5px 10px; line-height: 1.5; color: #fff; margin-bottom: 0.6em; margin-top: 1.8em;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents .schedule_list .img_list{display:block;;flex-wrap: nowrap;justify-content: flex-start;align-items: stretch; margin: 10px 0;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents .schedule_list .schedule_inner {padding:5px;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents .schedule_list .img_list li{ width: 100%;margin-bottom: 10px;} .contents.col_2.post .inner .content .content_left .post_inner .volunteer_contents .schedule_list .img_list img{ margin:0;} .contact_btn {position: relative;margin: 20px 0;background: #ad0040;text-decoration: none;border-radius: 4px;-webkit-border-radius: 4px; -moz-border-radius: 4px;text-align: center;display: inline-block;text-decoration: none;} .contact_btn a {padding: 14px;color: #FFF!important;font-size: 14px; line-height: 1.4em; font-weight: bold; display: inline-block; text-decoration: none;} }