@charset "utf-8";
.fv{
background-color: #e6faff;
text-align: center;
background-image: url(/chintai/images/pc_fv_bg.png);
background-position: bottom center;
background-repeat: no-repeat;
}
.fv .col_1{
height: 265px;
text-align: left;
margin: 0 auto;
width: 1024px;
padding-top: 1.8em;
}
.fv .col_1 p{
background-color: #277eb3;
color: #fff;
font-weight: 700;
padding: 10px 15px 5px;
font-size: 1.4em;
letter-spacing: 1px;
display: inline-block;
margin-left: 10px;
}
.waku{
background-color: #e6faff;
margin: 0 auto 1em;
padding: 1.5em;
}
.waku p.memo{
border-bottom: 1px dotted #ccc;
margin-bottom: .5em;
font-size: 20px;
font-weight: 700;
text-align: center;
}
.yt_box{
width: 75%;
margin: 0 auto;
}
.greeting{
background-color: #FFF;
border-radius: 8px;
padding: 1.5em;
box-sizing: border-box;
margin: 1.5em 0 2em;
text-align: left;
}
.greeting .flex_box, .flex_box.youtube, dl.memo .flex_box{
justify-content: space-between;
}
.flex_box.youtube .half{
width: 54%;
}
.greeting .sub_title{
color: #277eb3;
font-weight: 700;
font-size: 1.4em;
border-bottom: 1px solid #277eb3;
margin-bottom: .25em;
}
.txt{
padding: .5em;
font-size: 17px;
line-height: 1.6;
}
.message .right_txt{
padding: .75em .5em 0;
font-size: 17px;
text-align: right;
}
.ber{
background-color: #DF0075;
color: #fff;
text-align: center;
border-radius: 25px;
font-weight: 700;
padding: 5px;
margin: .5em 0;
}
dl.memo{
text-align: left;
}
dl.memo dt{
	border-bottom: 1px solid #ccc;
	font-weight: 700;
	margin: .5em 0 .15em 1em;	
}
dl.memo dt:before{
  content: '■';
  color: #277eb3;
  margin-left: -1em;
}
dl.memo dd{
	margin: .25em 0 .75em 1em;
}
dl.memo dd ul.note li{
border-bottom: 1px dotted #b7b7b7;
list-style: disc;
margin: .25em 0 .5em 1em;
}
dl.memo dd.flex_box div.merit{
border: 2px dotted #ccc;
border-radius: 6px;
padding: 1em;
width: 45.5%;
margin: .5em 0;
}
dl.memo dd.flex_box div.merit p{
text-align: center;
font-size: 1.2em;
font-weight: 700;
text-decoration: underline;
text-decoration-color: currentcolor;
text-decoration-thickness: auto;
text-decoration-thickness: 0.5em;
text-decoration-color: rgba(168, 218, 251, 0.9);
text-underline-offset: -0.2em;
text-decoration-skip-ink: none;
padding: 0 0 .75em 0;
}
dl.memo dd.flex_box div p.sub_title1{
text-decoration-color: rgba(255, 255, 0, 0.9);
}
ul.disc li{
list-style: disc;
margin-left: 1em;
}
dl.memo dd.flex_box div.plan_list{
width: 37.5%;
margin: .5em 0;
text-align: center;
}
dl.memo dd.flex_box div.plan_list img{
width: 100%;
}
dl.memo dd.flex_box div.plan_txt{
width: 60.5%;
margin: .5em 0;
}
p.t_plan{
background-color: #1fb8ca;
color: #fff;
border-radius: 25px;
width: 285px;
text-align: center;
font-weight: 700;
}
p.t_plan.sta{
margin-top: 1.25em;
background-color: #ef8691;	
}
p.t_plan.spe{
background-color: #10a3dd;	
}
p.t_plan.yut{
margin-top: 1.25em;
background-color: #5188b1;	
}
p.t_plan.sei{
margin-top: 1.25em;
background-color: #f78a00;	
}
ul.note li ul.sub_list{
margin-bottom:.25em;
}
ul.note li ul.sub_list li{
list-style: circle;
border-bottom: none;
margin: 0 0 0 1em;
}
.ur{
border: 1px dashed #ccc;
padding: 1em 1.5em;
}
.ur p{
font-size: 14px;
}
.nuri{
background-color: #DF005A;
color: #fff;
font-weight: 700;
text-align: center;
padding: .25em 0;
margin-bottom: .5em;
font-size: 20px;
border-radius: 25px;
}
dl.memo dd ol li{
list-style-type: upper-roman;
margin: .5em 0 0 1.5em;
}
dl.memo dd ol li ul.disc li{
list-style: disc;
margin: 0 0 0 1em;
}
.graph_date{
background-color: #EDFAFF;
padding: 1em 1.5em;
border-radius: 8px;
}
.graph_date p.note{
border-bottom: 1px dotted #ccc;
padding-top: 5px;
}
.graph_date p.total{
border-top: 1px solid #999;
padding: 5px 10px 0 0;
text-align: right;
}
span.blue{
background-color: #005DBF;
color: #fff;
padding: 0 .5em;
}
/* ブラウザサイズが600px以下になったときのスタイル */
@media screen and (max-width: 600px) {
  .responsive-table {
    width: 100%; /* テーブルの幅を100%に設定 */
  }
  
.responsive-table th,
.responsive-table td {
    display: block; /* ブロック要素として表示 */
    width: 100%; /* 幅を100%に設定 */
    border-bottom:none; /* セルの下部の境界線を削除 */
  }
  
  .responsive-table tr:last-child{
    border-bottom: solid 1px #ccc; /* 最後の行の下部に境界線を追加 */
  }
}


@media screen and (max-width: 810px) {
.tab,.pc{
display: block;
}
.sp, .navi.flex_box, .shacho{
display: none;
}
body {
	}
img{
width: 100%;
height: auto;
}
.col_1 .logo {
width: 36.5%;
}
.fv .col_1, .greeting .message{
width: 100%;
height: auto;
}
.fv .col_1 .left {
width: 75%;
margin: 0 auto;
}
.fv .col_1 .right {
width: 100%;
margin: 0 auto;
text-align: center;
}
.fv .col_1 .right .flex_box{
justify-content: space-around;
}
.fv .col_1 .right .flex_box .point{
width: 48%;
}
.change{
height: 0;
margin: 0;
padding: 0;
}
    .btn-gNav {
        display: block;
    }

    .gNav {
        position: fixed;
        top: 0;
        right: -100%;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.8);
        font-size: 16px;
        box-sizing: border-box;
        z-index: 1;
        padding-top: 50px;
        transition: .3s;
    }

    .gNav.open {
        right: 0;
    }

    .gNav .gNav-menu {
        padding: 0;
        width: 100%;
        height: 100%;
        display: block;
        flex-direction: column;
        text-align: center;
        /*justify-content: center;*/
    }

    .gNav .gNav-menu li {
        width: 86%;
        padding: 15px;
        border-bottom: #525252 1px solid;
		border-left: none;
    }
.gNav .gNav-menu li:last-child {
	border-right: none;
}
    .gNav .gNav-menu li a{
        color: #fff;
    }
.fv{
width: 100%;
max-width: 100%;
margin: 0 auto;
height: auto;
}
.hanbai_box .plan{
width: calc(98% / 2);
text-align: center;
margin-bottom: .5em;
}
.hanbai_box ul.note.flex_box li {
  width: calc(84% / 2);
}
}
@media screen and (max-width: 480px) {
.flex_box.youtube .half {
width: 100%;
}
.greeting{
padding: .5em;		
}
dl.memo dd.flex_box div.merit {
width: 85.5%;
}
dl.memo dd.flex_box div.plan_txt {
width: 100%;
margin: .5em 0;
}
dl.memo dd.flex_box div.plan_list {
display: none;
}
}