@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/



/*------------

記事内コンテンツ

-------------*/

/* TOP余白 */
.top #content {
    padding-top: 1em;
}

.l-mainContent__inner>.post_content {
    margin-top: .5em;
    margin-bottom: .5em;
	padding: 0;
}

.top-h1 {
    font-size: 24px !important;
	font-weight: 700 !important;
}

.p-articleMetas.-frontpage {
    margin: .75em 0;
}


.p-articleMetas.-frontpage {
	display: flex;
	align-items: center;
	flex-wrap: wrap; /* 折り返し許容（必要に応じて） */
	gap: 10px; /* 要素間の余白 */
}

.p-articleMetas {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    font-size: 12px;
    gap: .625em;
    padding: 0 1px;
}

.p-articleMetas.-frontpage > * {
	margin-bottom: 0 !important; /* SWELL等で余白がある場合に打ち消し */
}
	

@media (max-width: 767px) {
    .top-h1 {
        font-size: 16px !important;
    }
	
}	



/* メリット枠 */

.merit {
    background: #f3f3f3;
    padding: 15px;
    margin: 15px;
}

.merit .merit_ttl {
    font-size: 19px;
    font-weight: bold;
    border-bottom: solid 3px rgb(87,81,129) ;
    text-align: center;
}

.merit li {
    margin: 1em 0;
}

.merit ol {
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: li;
    font-weight: bold;
}

.merit ol li {
    position: relative;
    font-size: 16px;
    padding-left: 1.5em;
    line-height: 1.5;
}

.merit ol li::before {
    counter-increment: li;
    content: counter(li);
    position: absolute;
    left: 0;
    top: 2px;
    display: block;
    width: 20px;
    height: 20px;
    font-size: 27px;
    font-weight: bold;
    color: #38a9f6;
    line-height: 20px;
    text-align: center;
}


/* この記事の執筆者の枠 */

.box27 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #62c1ce;
}

.box27 .box-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 17px;
    background: #62c1ce;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}

/* カードリンク */

.eq {
    display: flex;	
}

.con_t {
  display: flex;
  align-items: center;
  height: auto;
  padding: 10px;
}
	
.con_t .feature {
  display: block;
}
	
.con_i {
  display: flex;
  justify-content: center;
  align-items: center;
  height: auto;
  padding: 0 0 0 17px;	
}
	
.link_card {
  background-color: #ffebcd;
  padding: 10px;
  margin: 15px 0;
}	
	
.link_card_ttl {	
font-size: 18px;
font-weight: 700;
}

.link_card_ttl a:hover {
    text-decoration: underline;
}

/* ボタン */

.button-main.btn_red {
    background: #D20000 !important;
    color: #fff !important;
    margin-top: 8px;
    font-weight: bold;
}

a, a:link, a:visited, a:active {
    cursor: pointer;
    text-decoration: none;
    outline: none background-color #ffc9d7;
}

.block {
    display: block;
}

.border_radius {
    border-radius: 36px;
}

.w90p {
    width: 90%;
}

.mb20 {
    margin-bottom: 20px !important;
}

.ma_auto {
    margin-left: auto;
    margin-right: auto;
}

.pa20 {
    padding: 20px !important;
}

.ma_auto {
    margin-left: auto;
    margin-right: auto;
}

.mb20 {
    margin-bottom: 20px !important;
}

.text-center {
    text-align: center;
}


/* QA */

.qa_ar {
margin: 30px 0;
}

.question_co::before,
.answer_co::before {
  position: absolute;
  top: 0;
  left: -50px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  text-align: center;
  line-height: 40px;
  font-size: 21px;
  font-weight: bold;
  color: #fff;
}

.question_co,
.answer_co {
  position: relative;
  margin-left: 50px;
  min-height: 40px;
  margin-bottom: 10px;
}

.question_co::before {
  color: #fff;
  background: #C6C1E0;
  top: -7px;
  content: "Q";
}

.question_co {
  color: #1b2e42;
  font-weight: bold;
}

.answer_co::before {
  top: -7px;
  content: "A";
  background: #D20000;
}


/* 口コミ */

.kk {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    border: 3px solid #e0d0c9;
    padding: 20px;
    margin: 20px;
}

.kk p {
	margin-bottom: 0;	
	}	
	
.kk_i {
    flex-basis: 9%;
}
	
.kk_c {
    flex-basis: 84%;
    padding-left: 20px;
}
	
.kk_name {
    font-size: 19px;
    font-weight: bold;
}
	
.star5_rating {
    position: relative;
    z-index: 0;
    display: inline-block;
    white-space: nowrap;
    color: #CCCCCC;
    font-size: 21px;
}
	
.star5_rating:before, .star5_rating:after {
    content: '★★★★★';
}
	
.kk_r {
    font-size: 95%;
    padding-left: 12%;
}
	
@media (max-width: 767px) {
.kk_r {
    padding-left: 0;
}
}
	
.star5_rating {
    position: relative;
    z-index: 0;
    display: inline-block;
    white-space: nowrap;
    color: #CCCCCC;
    font-size: 21px;
}
	
.star5_rating:before,
.star5_rating:after{
    content: '★★★★★';
}
	
.star5_rating:after {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    overflow: hidden;
    white-space: nowrap;
    color: #ffcf32; /* イエローカラー 自由に設定化 */
}
	
.star5_rating[data-rate="5"]:after{ width: 100%; } /* 星5 */
.star5_rating[data-rate="4.5"]:after{ width: 90%; } /* 星4.5 */
.star5_rating[data-rate="4"]:after{ width: 80%; } /* 星4 */
.star5_rating[data-rate="3.5"]:after{ width: 70%; } /* 星3.5 */
.star5_rating[data-rate="3"]:after{ width: 60%; } /* 星3 */
.star5_rating[data-rate="2.5"]:after{ width: 50%; } /* 星2.5 */
.star5_rating[data-rate="2"]:after{ width: 40%; } /* 星2 */
.star5_rating[data-rate="1.5"]:after{ width: 30%; } /* 星1.5 */
.star5_rating[data-rate="1"]:after{ width: 20%; } /* 星1 */
.star5_rating[data-rate="0.5"]:after{ width: 10%; } /* 星0.5 */
.star5_rating[data-rate="0"]:after{ width: 0%; } /* 星0 */
	


/* parts/search_area（aside > 都道府県検索） */
	
.search_area_link_box {
    border: 2px solid #3d356f;
    margin-bottom: 20px;
}	
	
.search_area_link_box .search_area_link_head {
    background: #3d356f;
    font-size: 15px;
    line-height: 20px;
    font-weight: bold;
    text-align: center;
    padding: 10px 0;
    color: #fff;
}

	
.search_area_link_box .search_area_link_body  {
    font-size: 12px;
}		
	
.search_area_link_box .search_area_link_body .area_title {
    background: #f7f6f0;
	padding: 5px;
}	
	
.search_area_link_box .search_area_link_body .area_text {
	padding: 5px;
	
}		
	
.search_area_link_box .search_area_link_body ul {
    padding: 0;
	margin: 0;
}
	
.search_area_link_box .search_area_link_body li {
    display: inline-block;
    font-size: 13px;
	margin-right: 2px;
}