@charset "UTF-8";




/*円*/


/*円の中の文字列が「１行」*/

/*枠線１ピクセル*/
.circle1_1px{
display: inline-block;
width: 80px;
height: 80px;
border-radius: 50%;
text-align:center;
line-height: 80px;
border: solid 1px #000 !important;
font-weight: 600;		
}

/*枠線２ピクセル*/
.circle1_2px{
display: inline-block;
width: 80px;
height: 80px;
border-radius: 50%;
text-align:center;
line-height: 80px;
border: solid 2px #000 !important;
font-weight: 600;		
}


/*円の中の文字列が「２行以上」*/

/*枠線１ピクセル*/
.circle2_1px {	
position: relative;
display: inline-block;
width: 80px;
height: 80px;
border-radius: 50%;
border: solid 1px #000 !important;	
}

.circle2_1px span {
position: absolute;
display: inline-block;
left: 0;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
width :80px;
text-align:center;
font-weight: 600;	
}


/*枠線２ピクセル*/
.circle2_2px {	
position: relative;
display: inline-block;
width: 80px;
height: 80px;
border-radius: 50%;
border: solid 2px #000 !important;	
}

.circle2_2px span {
position: absolute;
display: inline-block;
left: 0;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
width :80px;
text-align:center;
font-weight: 600;	
}


/*ふと長い矢印*/

/*右向き*/

.boldright{
    position: relative;
}
.boldright::before{
    content: "";
    display: block;
    position: absolute;
    top: 12px;
    left: 10px;
    width: 30px;
    height: 16px;
    background: #666;
}
.boldright::after{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 40px;
    width: 0;
    height: 0;
    border: 20px solid;
    border-color: transparent transparent transparent #666;
}


/*右向き*/

.boldleft{
    position: relative;
}
.boldleft::before{
    content: "";
    display: block;
    position: absolute;
    top: 12px;
    left: 40px;
    width: 50px;
    height: 16px;
    background: #666;
}
.boldleft::after{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    border: 20px solid;
    border-color: transparent #666 transparent transparent;
}


/*上向き*/

.boldtop{
    position: relative;
}
.boldtop::before{
    content: "";
    display: block;
    position: absolute;
    top: 40px;
    left: 12px;
    width: 16px;
    height: 50px;
    background: #666;
}
.boldtop::after{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    border: 20px solid;
    border-color: transparent transparent #666 transparent;
}


/*下向き*/

.boldbottom{
    position: relative;
}
.boldbottom::before{
    content: "";
    display: block;
    position: absolute;
    top: 0px;
    left: 12px;
    width: 16px;
    height: 50px;
    background: #666;
}
.boldbottom::after{
    content: "";
    display: block;
    position: absolute;
    top: 50px;
    left: 0;
    width: 0;
    height: 0;
    border: 20px solid;
    border-color: #666 transparent transparent transparent;
}


.whitebg td{ background-color: white}




/*テーブルを可変*/

/*768以上表示*/
.srn_big{ display: none;}
@media screen and (min-width:768px) {.srn_big{display: block;}}


/*768未満表示*/
/*.srn_sml{ display: none;}
@media screen and (max-width:767px) {.srn_sml{display: block;}}*/


/*宅建*/
.srn_sml p{font-family: "Yu Mincho", "Hiragino Mincho ProN", "serif";}

.hbn span.red{font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;} 

.gsh{font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif; font-weight: 200;} 

.gsh td{font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif; font-weight: 250 !important;} 

/*宅建　本文　文字サイズ*/
.srn_sml p{font-family: "Yu Mincho", "Hiragino Mincho ProN", "serif";}
@media screen and (min-width:1025px) {.srn_sml p {font-size:22.5px !important ;}}
@media screen and (max-width:1024px) {.srn_sml p {font-size:21.5px !important ;}}
@media screen and (max-width:1010px) {.srn_sml p {font-size:21px !important ;}}
@media screen and (max-width:990px) {.srn_sml p {font-size:20.5px !important ;}}
@media screen and (max-width:970px) {.srn_sml p {font-size:20px !important ;}}
@media screen and (max-width:950px) {.srn_sml p {font-size:19.5px !important ;}}
@media screen and (max-width:930px) {.srn_sml p {font-size:19px !important ;}}
@media screen and (max-width:910px) {.srn_sml p {font-size:18.5px !important ;}}
@media screen and (max-width:890px) {.srn_sml p {font-size:18px !important ;}}
@media screen and (max-width:870px) {.srn_sml p {font-size:17.5px !important ;}}
@media screen and (max-width:850px) {.srn_sml p {font-size:17px !important ;}}
@media screen and (max-width:830px) {.srn_sml p {font-size:16.5px !important ;}}
@media screen and (max-width:810px) {.srn_sml p {font-size:16px !important ;}}
@media screen and (max-width:790px) {.srn_sml p {font-size:15.5px !important ;}}
@media screen and (max-width:768px) {.srn_sml p {font-size:21.0px !important ;}}
@media screen and (max-width:750px) {.srn_sml p {font-size:20.8px !important ;}}
@media screen and (max-width:710px) {.srn_sml p {font-size:20.5px !important ;}}
@media screen and (max-width:690px) {.srn_sml p {font-size:20.2px !important ;}}
@media screen and (max-width:670px) {.srn_sml p {font-size:20.0px !important ;}}
@media screen and (max-width:650px) {.srn_sml p {font-size:21.5px !important ;}}
@media screen and (max-width:630px) {.srn_sml p {font-size:20.0px !important ;}}
@media screen and (max-width:610px) {.srn_sml p {font-size:19.5px !important ;}}
@media screen and (max-width:590px) {.srn_sml p {font-size:19.0px !important ;}}
@media screen and (max-width:570px) {.srn_sml p {font-size:18.5px !important ;}}
@media screen and (max-width:530px) {.srn_sml p {font-size:18.0px !important ;}}
@media screen and (max-width:510px) {.srn_sml p {font-size:17.5px !important ;}}
@media screen and (max-width:490px) {.srn_sml p {font-size:17.0px !important ;}}
@media screen and (max-width:470px) {.srn_sml p {font-size:16.5px !important ;}}
@media screen and (max-width:430px) {.srn_sml p {font-size:16.0px !important ;}}
@media screen and (max-width:414.5px) {.srn_sml p {font-size:15.5px !important ;}}
@media screen and (max-width:375px) {.srn_sml p {font-size:14.5px !important ;}}
@media screen and (max-width:320px) {.srn_sml p {font-size:13.5px !important ;}}


/*宅建　本文　文字サイズ*/
.mozit01 td{font-family: "Yu Mincho", "Hiragino Mincho ProN", "arial";}
/*半角が細くなる現象をなくすため、"serif" を　"arial"にした 2024/04/04   'Noto Sans JP'*/

@media screen and (min-width:1025px) {.mozit01 td {font-size:15px !important ;}}
@media screen and (max-width:1024px) {.mozit01 td {font-size:14.6px !important ;}}
@media screen and (max-width:1010px) {.mozit01 td {font-size:14.3px !important ;}}
@media screen and (max-width:990px) {.mozit01 td {font-size:14px !important ;}}
@media screen and (max-width:970px) {.mozit01 td {font-size:13.6px !important ;}}
@media screen and (max-width:950px) {.mozit01 td {font-size:13.3px !important ;}}
@media screen and (max-width:930px) {.mozit01 td {font-size:13px !important ;}}
@media screen and (max-width:910px) {.mozit01 td {font-size:12.6px !important ;}}
@media screen and (max-width:890px) {.mozit01 td {font-size:12.3px !impor8.tant ;}}
@media screen and (max-width:870px) {.mozit01 td {font-size:12px !important ;}}
@media screen and (max-width:850px) {.mozit01 td {font-size:11.7px !important ;}}
@media screen and (max-width:830px) {.mozit01 td {font-size:11.5px !important ;}}
@media screen and (max-width:810px) {.mozit01 td {font-size:11.2px !important ;}}
@media screen and (max-width:790px) {.mozit01 td {font-size:11px !important ;}}
@media screen and (max-width:768px) {.mozit01 td {font-size:10.8px !important ;}}
@media screen and (max-width:750px) {.mozit01 td {font-size:10.7px !important ;}}
@media screen and (max-width:710px) {.mozit01 td {font-size:10.6px !important ;}}
@media screen and (max-width:690px) {.mozit01 td {font-size:10.5px !important ;}}
@media screen and (max-width:670px) {.mozit01 td {font-size:10.4px !important ;}}
@media screen and (max-width:650px) {.mozit01 td {font-size:10.3px !important ;}}
@media screen and (max-width:630px) {.mozit01 td {font-size:10.2px !important ;}}
@media screen and (max-width:610px) {.mozit01 td {font-size:10.1px !important ;}}
@media screen and (max-width:590px) {.mozit01 td {font-size:10.0px !important ;}}
@media screen and (max-width:570px) {.mozit01 td {font-size:9.8px !important ;}}
@media screen and (max-width:530px) {.mozit01 td {font-size:9.6px !important ;}}
@media screen and (max-width:510px) {.mozit01 td {font-size:9.5px !important ;}}
@media screen and (max-width:490px) {.mozit01 td {font-size:9.3px !important ;}}
@media screen and (max-width:470px) {.mozit01 td {font-size:9.2px !important ;}}
@media screen and (max-width:430px) {.mozit01 td {font-size:9.1px !important ;}}
@media screen and (max-width:414.5px) {.mozit01 td {font-size:9px !important ;}}
@media screen and (max-width:375px) {.mozit01 td {font-size:7.2px !important ;}}
@media screen and (max-width:320px) {.mozit01 td {font-size:7.0px !important ;}}


/*宅建　サイド　文字サイズ*/


/*宅建用に設定していた記述　辻設定のフォントで、文字が小さい　→　これを768以上に適用する　*/

@media screen and (min-width:1025px) {.srn_sml2 p {font-size:18px !important ; font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";font-weight: 200;}}
@media screen and (max-width:1024px) {.srn_sml2 p {font-size:18px !important ; font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";font-weight: 200;}}
@media screen and (max-width:1010px) {.srn_sml2 p {font-size:17.5px !important ; font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";font-weight: 200;}}
@media screen and (max-width:990px) {.srn_sml2 p {font-size:17px !important ; font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";font-weight: 200;}}
@media screen and (max-width:970px) {.srn_sml2 p {font-size:16.5px !important ; font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";font-weight: 200;}}
@media screen and (max-width:950px) {.srn_sml2 p {font-size:16px !important ; font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";font-weight: 200;}}
@media screen and (max-width:930px) {.srn_sml2 p {font-size:15.5px !important ; font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";font-weight: 200;}}
@media screen and (max-width:910px) {.srn_sml2 p {font-size:15px !important ; font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";font-weight: 200;}}
@media screen and (max-width:890px) {.srn_sml2 p {font-size:14.5px !important ; font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";font-weight: 200;}}
@media screen and (max-width:870px) {.srn_sml2 p {font-size:14px !important ; font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";font-weight: 200;}}
@media screen and (max-width:850px) {.srn_sml2 p {font-size:13.5px !important ; font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";font-weight: 200;}}
@media screen and (max-width:830px) {.srn_sml2 p {font-size:13px !important ; font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";font-weight: 200;}}
@media screen and (max-width:810px) {.srn_sml2 p {font-size:12.5px !important ; font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";font-weight: 200;}}
@media screen and (max-width:790px) {.srn_sml2 p {font-size:12px !important ; font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";font-weight: 200;}}



/*問題を解消するために、新たに宅建用に設定した記述　深川設定のフォントで、文字が大きい　これを768未満に設定する　*/


@media screen and (max-width:768px) {.srn_sml2 p {font-size:14.5px !important ; font-family: 'Noto Sans JP', sans-serif !important;font-weight: 400;}}
@media screen and (max-width:750px) {.srn_sml2 p {font-size:14.5px !important ; font-family: 'Noto Sans JP', sans-serif !important;font-weight: 400;}}
@media screen and (max-width:710px) {.srn_sml2 p {font-size:14.0px !important ; font-family: 'Noto Sans JP', sans-serif !important;font-weight: 400;}}
@media screen and (max-width:690px) {.srn_sml2 p {font-size:16.5px !important ; font-family: 'Noto Sans JP', sans-serif !important;font-weight: 400;}}
@media screen and (max-width:414.5px) {.srn_sml2 p {font-size:17.5px !important ; font-family: 'Noto Sans JP', sans-serif !important;font-weight: 400;}}
@media screen and (max-width:375px) {.srn_sml2 p {font-size:17.5px !important ; font-family: 'Noto Sans JP', sans-serif !important;font-weight: 400;}}
@media screen and (max-width:320px) {.srn_sml2 p {font-size:16.0px !important ; font-family: 'Noto Sans JP', sans-serif !important;font-weight: 400;}}


/*上記のバックアップ　*/

/*.srn_sml2 p{font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";font-weight: 200;}
@media screen and (min-width:1025px) {.srn_sml2 p {font-size:18px !important ;}}
@media screen and (max-width:1024px) {.srn_sml2 p {font-size:18px !important ;}}
@media screen and (max-width:1010px) {.srn_sml2 p {font-size:17.5px !important ;}}
@media screen and (max-width:990px) {.srn_sml2 p {font-size:17px !important ;}}
@media screen and (max-width:970px) {.srn_sml2 p {font-size:16.5px !important ;}}
@media screen and (max-width:950px) {.srn_sml2 p {font-size:16px !important ;}}
@media screen and (max-width:930px) {.srn_sml2 p {font-size:15.5px !important ;}}
@media screen and (max-width:910px) {.srn_sml2 p {font-size:15px !important ;}}
@media screen and (max-width:890px) {.srn_sml2 p {font-size:14.5px !important ;}}
@media screen and (max-width:870px) {.srn_sml2 p {font-size:14px !important ;}}
@media screen and (max-width:850px) {.srn_sml2 p {font-size:13.5px !important ;}}
@media screen and (max-width:830px) {.srn_sml2 p {font-size:13px !important ;}}
@media screen and (max-width:810px) {.srn_sml2 p {font-size:12.5px !important ;}}
@media screen and (max-width:790px) {.srn_sml2 p {font-size:12px !important ;}}
@media screen and (max-width:768px) {.srn_sml2 p {font-size:11.5px !important ;}}
@media screen and (max-width:750px) {.srn_sml2 p {font-size:14.5px !important ;}}
@media screen and (max-width:710px) {.srn_sml2 p {font-size:14.0px !important ;}}
@media screen and (max-width:690px) {.srn_sml2 p {font-size:13.5px !important ;}}
@media screen and (max-width:414.5px) {.srn_sml2 p {font-size:9.5px !important ;}}
@media screen and (max-width:375px) {.srn_sml2 p {font-size:14.5px !important ;}}
@media screen and (max-width:320px) {.srn_sml2 p {font-size:13.0px !important ;}}



.srn_sml2 p{font-family: 'Noto Sans JP', sans-serif !important;font-weight: 400;}
@media screen and (min-width:1025px) {.srn_sml2 p {font-size:18px !important ;}}
@media screen and (max-width:1024px) {.srn_sml2 p {font-size:18px !important ;}}
@media screen and (max-width:1010px) {.srn_sml2 p {font-size:17.5px !important ;}}
@media screen and (max-width:990px) {.srn_sml2 p {font-size:17px !important ;}}
@media screen and (max-width:970px) {.srn_sml2 p {font-size:16.5px !important ;}}
@media screen and (max-width:950px) {.srn_sml2 p {font-size:16px !important ;}}
@media screen and (max-width:930px) {.srn_sml2 p {font-size:15.5px !important ;}}
@media screen and (max-width:910px) {.srn_sml2 p {font-size:15px !important ;}}
@media screen and (max-width:890px) {.srn_sml2 p {font-size:14.5px !important ;}}
@media screen and (max-width:870px) {.srn_sml2 p {font-size:14px !important ;}}
@media screen and (max-width:850px) {.srn_sml2 p {font-size:13.5px !important ;}}
@media screen and (max-width:830px) {.srn_sml2 p {font-size:13px !important ;}}
@media screen and (max-width:810px) {.srn_sml2 p {font-size:12.5px !important ;}}
@media screen and (max-width:790px) {.srn_sml2 p {font-size:12px !important ;}}
@media screen and (max-width:768px) {.srn_sml2 p {font-size:11.5px !important ;}}
@media screen and (max-width:750px) {.srn_sml2 p {font-size:14.5px !important ;}}
@media screen and (max-width:710px) {.srn_sml2 p {font-size:14.0px !important ;}}
@media screen and (max-width:690px) {.srn_sml2 p {font-size:16.5px !important ;}}
@media screen and (max-width:414.5px) {.srn_sml2 p {font-size:17.5px !important ;}}
@media screen and (max-width:375px) {.srn_sml2 p {font-size:17.5px !important ;}}
@media screen and (max-width:320px) {.srn_sml2 p {font-size:16.0px !important ;}}*/



/*宅建　項　文字サイズ*/
.tk_kou{font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif !important; font-weight: 600;}
@media screen and (min-width:1025px) {.tk_kou {font-size:27.5px !important ;}}
@media screen and (max-width:1024px) {.tk_kou {font-size:27.5px !important ;}}
@media screen and (max-width:1010px) {.tk_kou {font-size:27px !important ;}}
@media screen and (max-width:990px) {.tk_kou {font-size:27.0px !important ;}}
@media screen and (max-width:970px) {.tk_kou {font-size:26.75px !important ;}}
@media screen and (max-width:950px) {.tk_kou {font-size:26.5px !important ;}}
@media screen and (max-width:930px) {.tk_kou {font-size:26px !important ;}}
@media screen and (max-width:910px) {.tk_kou {font-size:25.5px !important ;}}
@media screen and (max-width:890px) {.tk_kou {font-size:25px !important ;}}
@media screen and (max-width:870px) {.tk_kou {font-size:24.5px !important ;}}
@media screen and (max-width:850px) {.tk_kou {font-size:23.5px !important ;}}
@media screen and (max-width:830px) {.tk_kou {font-size:22.5px !important ;}}
@media screen and (max-width:810px) {.tk_kou {font-size:22px !important ;}}
@media screen and (max-width:790px) {.tk_kou {font-size:21.5px !important ;}}
@media screen and (max-width:768px) {.tk_kou {font-size:23.0px !important ;}}
@media screen and (max-width:750px) {.tk_kou {font-size:22.8px !important ;}}
@media screen and (max-width:710px) {.tk_kou {font-size:22.5px !important ;}}
@media screen and (max-width:690px) {.tk_kou {font-size:22.2px !important ;}}
@media screen and (max-width:670px) {.tk_kou {font-size:22.0px !important ;}}
@media screen and (max-width:650px) {.tk_kou {font-size:23.5px !important ;}}
@media screen and (max-width:630px) {.tk_kou {font-size:22.0px !important ;}}
@media screen and (max-width:610px) {.tk_kou {font-size:21.5px !important ;}}
@media screen and (max-width:590px) {.tk_kou {font-size:21.0px !important ;}}
@media screen and (max-width:570px) {.tk_kou {font-size:19.5px !important ;}}
@media screen and (max-width:530px) {.tk_kou {font-size:19.0px !important ;}}
@media screen and (max-width:510px) {.tk_kou {font-size:18.0px !important ;}}
@media screen and (max-width:490px) {.tk_kou {font-size:19.0px !important ;}}
@media screen and (max-width:470px) {.tk_kou {font-size:18.0px !important ;}}
@media screen and (max-width:430px) {.tk_kou {font-size:17.0px !important ;}}
@media screen and (max-width:375px) {.tk_kou {font-size:16.3px !important ;}}
@media screen and (max-width:320px) {.tk_kou {font-size:15.5px !important ;}}


.bld_800 { font-weight:800 !important;}
.bld_700 { font-weight:700 !important;}
.bld_600 { font-weight:500 !important;}
.bld_500 { font-weight:700 !important;}
.bld_400 { font-weight:400 !important;}
.bld_300 { font-weight:300 !important;}
.bld_200 { font-weight:200 !important;}
.bld_100 { font-weight:100 !important;}

 color:#0000ff !important;



.red {
  color: #ce217d;
  font-weight:500 !important;
}







/*宅建　本文スペース*/


@media screen and (min-width:769px) {.hbn {width: 75%; !important; padding-top: 20px !important; padding-bottom: 20px !important; padding-left: 20px !important; padding-right: 20px !important;}}

@media screen and (max-width:768px) {.hbn {width: 93%; !important; padding-top: 20px !important; padding-bottom: 20px !important; padding-left: 5px !important; padding-right: 5px !important;}}



@media screen and (min-width:769px) {.sid {width: 25%; !important;padding-top: 20px !important; padding-bottom: 20px !important; padding-left: 20px !important; padding-right: 20px !important;}}

@media screen and (max-width:768px) {.sid {width: 7%; !important;padding-top: 20px !important; padding-bottom: 20px !important; padding-left: 3px !important; padding-right: 0px !important;}}









/*画面サイズの調整*/


/*スタンダード*/
.ar_scale{width: 61%;}
@media screen and (max-width:1024px) {.ar_scale{width: 61%;}}
@media screen and (max-width:1010px) {.ar_scale{width: 63%;}}
@media screen and (max-width:990px) {.ar_scale{width: 65%;}}
@media screen and (max-width:970px) {.ar_scale{width: 67%;}}
@media screen and (max-width:950px) {.ar_scale{width: 70%;}}
@media screen and (max-width:930px) {.ar_scale{width: 72%;}}
@media screen and (max-width:910px) {.ar_scale{width: 75%;}}
@media screen and (max-width:890px) {.ar_scale{width: 78%;}}
@media screen and (max-width:870px) {.ar_scale{width: 81%;}}
@media screen and (max-width:850px) {.ar_scale{width: 84%;}}
@media screen and (max-width:830px) {.ar_scale{width: 88%;}}
@media screen and (max-width:810px) {.ar_scale{width: 92%;}}
@media screen and (max-width:790px) {.ar_scale{width: 96%;}}
@media screen and (max-width:768px) {.ar_scale{width: 100%;}}
@media screen and (max-width:750px) {.ar_scale{width: 55%;}}
@media screen and (max-width:730px) {.ar_scale{width: 56%;}}
@media screen and (max-width:710px) {.ar_scale{width: 58%;}}
@media screen and (max-width:690px) {.ar_scale{width: 60%;}}
@media screen and (max-width:670px) {.ar_scale{width: 61%;}}
@media screen and (max-width:650px) {.ar_scale{width: 63%;}}
@media screen and (max-width:630px) {.ar_scale{width: 65%;}}
@media screen and (max-width:610px) {.ar_scale{width: 67%;}}
@media screen and (max-width:590px) {.ar_scale{width: 70%;}}
@media screen and (max-width:570px) {.ar_scale{width: 72%;}}
@media screen and (max-width:550px) {.ar_scale{width: 75%;}}
@media screen and (max-width:530px) {.ar_scale{width: 78%;}}
@media screen and (max-width:510px) {.ar_scale{width: 81%;}}
@media screen and (max-width:490px) {.ar_scale{width: 84%;}}
@media screen and (max-width:470px) {.ar_scale{width: 88%;}}
@media screen and (max-width:450px) {.ar_scale{width: 92%;}}
@media screen and (max-width:430px) {.ar_scale{width: 96%;}}
@media screen and (max-width:414.5px) {.ar_scale{width: 100%;}}


.ar_scale td{ border:none !important; vertical-align: middle !important; padding: 0px !important;}


/*スタンダード*/
.ar_scale_bdr{width: 61%;}
@media screen and (max-width:1024px) {.ar_scale_bdr{width: 61%;}}
@media screen and (max-width:1010px) {.ar_scale_bdr{width: 63%;}}
@media screen and (max-width:990px) {.ar_scale_bdr{width: 65%;}}
@media screen and (max-width:970px) {.ar_scale_bdr{width: 67%;}}
@media screen and (max-width:950px) {.ar_scale_bdr{width: 70%;}}
@media screen and (max-width:930px) {.ar_scale_bdr{width: 72%;}}
@media screen and (max-width:910px) {.ar_scale_bdr{width: 75%;}}
@media screen and (max-width:890px) {.ar_scale_bdr{width: 78%;}}
@media screen and (max-width:870px) {.ar_scale_bdr{width: 81%;}}
@media screen and (max-width:850px) {.ar_scale_bdr{width: 84%;}}
@media screen and (max-width:830px) {.ar_scale_bdr{width: 88%;}}
@media screen and (max-width:810px) {.ar_scale_bdr{width: 92%;}}
@media screen and (max-width:790px) {.ar_scale_bdr{width: 96%;}}
@media screen and (max-width:768px) {.ar_scale_bdr{width: 100%;}}
@media screen and (max-width:750px) {.ar_scale_bdr{width: 55%;}}
@media screen and (max-width:730px) {.ar_scale_bdr{width: 56%;}}
@media screen and (max-width:710px) {.ar_scale_bdr{width: 58%;}}
@media screen and (max-width:690px) {.ar_scale_bdr{width: 60%;}}
@media screen and (max-width:670px) {.ar_scale_bdr{width: 61%;}}
@media screen and (max-width:650px) {.ar_scale_bdr{width: 63%;}}
@media screen and (max-width:630px) {.ar_scale_bdr{width: 65%;}}
@media screen and (max-width:610px) {.ar_scale_bdr{width: 67%;}}
@media screen and (max-width:590px) {.ar_scale_bdr{width: 70%;}}
@media screen and (max-width:570px) {.ar_scale_bdr{width: 72%;}}
@media screen and (max-width:550px) {.ar_scale_bdr{width: 75%;}}
@media screen and (max-width:530px) {.ar_scale_bdr{width: 78%;}}
@media screen and (max-width:510px) {.ar_scale_bdr{width: 81%;}}
@media screen and (max-width:490px) {.ar_scale_bdr{width: 84%;}}
@media screen and (max-width:470px) {.ar_scale_bdr{width: 88%;}}
@media screen and (max-width:450px) {.ar_scale_bdr{width: 92%;}}
@media screen and (max-width:430px) {.ar_scale_bdr{width: 96%;}}
@media screen and (max-width:414.5px) {.ar_scale_bdr{width: 100%;}}


/*スマホ→タブレット100%タイプ*/
.ar_scale_typ2{width: 61%;}
@media screen and (max-width:1024px) {.ar_scale_typ2{width: 61%;}}
@media screen and (max-width:1010px) {.ar_scale_typ2{width: 63%;}}
@media screen and (max-width:990px) {.ar_scale_typ2{width: 65%;}}
@media screen and (max-width:970px) {.ar_scale_typ2{width: 67%;}}
@media screen and (max-width:950px) {.ar_scale_typ2{width: 70%;}}
@media screen and (max-width:930px) {.ar_scale_typ2{width: 72%;}}
@media screen and (max-width:910px) {.ar_scale_typ2{width: 75%;}}
@media screen and (max-width:890px) {.ar_scale_typ2{width: 78%;}}
@media screen and (max-width:870px) {.ar_scale_typ2{width: 81%;}}
@media screen and (max-width:850px) {.ar_scale_typ2{width: 84%;}}
@media screen and (max-width:830px) {.ar_scale_typ2{width: 88%;}}
@media screen and (max-width:810px) {.ar_scale_typ2{width: 92%;}}
@media screen and (max-width:790px) {.ar_scale_typ2{width: 96%;}}
@media screen and (max-width:768px) {.ar_scale_typ2{width: 100%;}}

.ar_scale_typ2 td{ border:none !important; vertical-align: middle !important; padding: 0px !important;}


/*スマホ→タブレット100%タイプ*/
.ar_ar_scale2{width: 61%;}
@media screen and (max-width:1024px) {.ar_ar_scale2{width: 61%;}}
@media screen and (max-width:1010px) {.ar_ar_scale2{width: 63%;}}
@media screen and (max-width:990px) {.ar_ar_scale2{width: 65%;}}
@media screen and (max-width:970px) {.ar_ar_scale2{width: 67%;}}
@media screen and (max-width:950px) {.ar_ar_scale2{width: 70%;}}
@media screen and (max-width:930px) {.ar_ar_scale2{width: 72%;}}
@media screen and (max-width:910px) {.ar_ar_scale2{width: 75%;}}
@media screen and (max-width:890px) {.ar_ar_scale2{width: 78%;}}
@media screen and (max-width:870px) {.ar_ar_scale2{width: 81%;}}
@media screen and (max-width:850px) {.ar_ar_scale2{width: 84%;}}
@media screen and (max-width:830px) {.ar_ar_scale2{width: 88%;}}
@media screen and (max-width:810px) {.ar_ar_scale2{width: 92%;}}
@media screen and (max-width:790px) {.ar_ar_scale2{width: 96%;}}
@media screen and (max-width:768px) {.ar_ar_scale2{width: 100%;}}

.ar_ar_scale2 td{ border:none !important; vertical-align: middle !important; padding: 0px !important;}



/*スタンダード パソコン→タブレットは100%タイプ*/
.ar_scale3{width: 100%;}
@media screen and (max-width:768px) {.ar_scale3{width: 100%;}}
@media screen and (max-width:750px) {.ar_scale3{width: 55%;}}
@media screen and (max-width:730px) {.ar_scale3{width: 56%;}}
@media screen and (max-width:710px) {.ar_scale3{width: 58%;}}
@media screen and (max-width:690px) {.ar_scale3{width: 60%;}}
@media screen and (max-width:670px) {.ar_scale3{width: 61%;}}
@media screen and (max-width:650px) {.ar_scale3{width: 63%;}}
@media screen and (max-width:630px) {.ar_scale3{width: 65%;}}
@media screen and (max-width:610px) {.ar_scale3{width: 67%;}}
@media screen and (max-width:590px) {.ar_scale3{width: 70%;}}
@media screen and (max-width:570px) {.ar_scale3{width: 72%;}}
@media screen and (max-width:550px) {.ar_scale3{width: 75%;}}
@media screen and (max-width:530px) {.ar_scale3{width: 78%;}}
@media screen and (max-width:510px) {.ar_scale3{width: 81%;}}
@media screen and (max-width:490px) {.ar_scale3{width: 84%;}}
@media screen and (max-width:470px) {.ar_scale3{width: 88%;}}
@media screen and (max-width:450px) {.ar_scale3{width: 92%;}}
@media screen and (max-width:430px) {.ar_scale3{width: 96%;}}
@media screen and (max-width:414.5px) {.ar_scale3{width: 100%;}}


.ar_scale3 td{ border:none !important; vertical-align: middle !important; padding: 0px !important;}



/*スタンダード 全て100%タイプ*/
.ar_scale4{width: 100%;}
@media screen and (max-width:768px) {.ar_scale4{width: 100%;}}


.ar_scale4 td{ border:none !important; vertical-align: middle !important; padding: 0px !important;}


/*スタンダード 全て100%タイプ　ボーダー、パディング指定なし*/
.ar_scale5{width: 100%;}
@media screen and (max-width:768px) {.ar_scale5{width: 100%;}}






/* 縦横比一定の正方形 */
.sikaku {
  width: 50% ;
}
.sikaku2 {
  width : 100% ;
  padding-top : 100% ;
  background-color: #29d632;
}

.sikakukara {
  width: 50% ;
}
.sikakukara2 {
  width : 100% ;
  padding-top : 100% ;
  background-color: none;
}




/*PCでは無効（改行しない）*/
.sma{
    display: none;
}

/*スマートフォンでは有効（改行する）*/
@media screen and (max-width:414px) {
    .sma{
        display: block;
    }
}

/*PCでは無効（改行しない）*/
.tab{
    display: none;
}

/*スマートフォンでは有効（改行する）*/
@media screen and (max-width:768px) {
    .tab{
        display: block;
    }
}

/*tab PC適用*/
.tabpc{
    display: none;
}

/*tab pcでは有効*/
@media screen and (min-width:415px) {
    .tabpc{
        display: block;
    }
}


/*テーブルを可変*/

/*線なし、パディングなしタイプ*/
.tb_kahen{width: 65%;}
@media screen and (min-width: 1024px) {.tb_kahen{width: 65%;}}
@media screen and (max-width: 1023px) {.tb_kahen{width: 85%;}}
@media screen and (max-width: 768.5px) {.tb_kahen{width: 100%;}}
@media screen and (max-width: 428.5px) {.tb_kahen{width: 100%;}}
@media screen and (max-width: 390.5px) {.tb_kahen{width: 100%;}}
@media screen and (max-width: 320.5px) {.tb_kahen{width: 100%;}}

.tb_kahen td{border: none  !important; padding: 2px!important; }


.p_kahen{margin-left:1em;}
@media screen and (min-width: 1024px) {.p_kahen{margin-left: 1em;}}
@media screen and (max-width: 1023px) {.p_kahen{margin-left: 3em;}}
@media screen and (max-width: 768.5px) {.p_kahen{margin-left: 1em;}}
@media screen and (max-width: 428.5px) {.p_kahen{margin-left: 1em;}}
@media screen and (max-width: 390.5px) {.p_kahen{margin-left: 1em;}}
@media screen and (max-width: 320.5px) {.p_kahen{margin-left: 0em;}}


/*線なし、パディングなしタイプ*/
.tb_kahen2{width: 65%;}
@media screen and (min-width: 1024px) {.tb_kahen2{width: 65%;}}
@media screen and (max-width: 1023px) {.tb_kahen2{width: 85%;}}
@media screen and (max-width: 768.5px) {.tb_kahen2{width: 100%;}}
@media screen and (max-width: 428.5px) {.tb_kahen2{width: 100%;}}
@media screen and (max-width: 390.5px) {.tb_kahen2{width: 100%;}}
@media screen and (max-width: 320.5px) {.tb_kahen2{width: 100%;}}
.tb_kahen2 td{padding: 5px!important; } 


/*スマホとパソコンの横サイズ同じ*/
.tb_kahen3{width: 45%;}
@media screen and (min-width: 1024px) {.tb_kahen3{width: 45%;}}
@media screen and (min-width: 429px) and (max-width: 1023px) {.tb_kahen3{width: 60%;}}
@media screen and (max-width: 428.5px) {.tb_kahen3{width: 100%;}}
.tb_kahen3 td{padding: 2px!important; }
.tb_kahen3b td{border: none  !important; padding: 2px; }

/*囲み文字の指定*/

/*背景色あり(枠線あり)*/
.kakomimasu{display: inline-block; border: solid 1px #000; padding: 0px 4px; background-color: #faeef4;}
/*背景色なし*/
.kakomimasu2{display: inline-block; border: solid 1px #000; padding: 0px 4px;}

/*背景色あり(枠線なし)*/
.kakomimasu3{display: inline-block; border: none; padding: 0px 4px; background-color: #faeef4;}


/*（例とタイトルが）濃いピンク背景*/

.kakomimasu4{display: inline-block; border: none; padding: 6px 4px; background-color: #efcbe4; text-indent: -3em; padding-left: 3em; line-height: 1.2em; font-weight: bold;}


/*図の設定*/

/*記号や線があるtd*/
td .kigou {
	text-align: center;
	vertical-align: top ;
	overflow: hidden;
	line-height: 12px ;
	padding: 0 0 0 0 ;
	margin: 0 0 0 0  ;
	height: 22px ;
}

td .kigou img {
	vertical-align: top ;
	overflow: hidden ;
	max-width:100% ;
	height:auto ;
    margin: 0 0 0 0  ;
	padding: 0 0 0 0  ;
}

td .kigou p {
	vertical-align: middle ;
	line-height: 12px ;
	padding: 0px ;
	margin: 0px ;
	font-size: 12px ;
}




/*分数式のテーブル可変*/

.3kahen{
 width: 100px;	
}

/*@media screen and (min-width: 415px) {.3kahen td {width: 70%; background-color: aqua; margin-top: 100px !important;  }}
@media screen and (min-width: 769px) {.3kahen td {width: 50%; background-color: aqua; margin-top: 100px !important; }}*/



/*社労士用 小タイトル１*/

.s-1-sr {
  color:black;
  font-weight: bold;
  padding: 5px 5px 5px 15px;
  text-indent: 0;
  background-color: #faeef4 !important;
  border-radius: 5px;
  width: 100%;
  margin: 25px 0px 30px 0px;
  font-size: 33px;
}

@media screen and (max-width: 768.5px) {
  .s-1-sr {
    color:black;
    font-weight: bold;
    padding: 0.65062vw 0.65062vw 0.65062vw 1.95185vw;
    text-indent: 0;
    background-color: #faeef4 !important;
    border-radius: 0.65062vw;
    width: 100%;
    margin: 3.25309vw 0px 1.30124vw 0px;
    font-size: 3.7vw;
  }
}

@media screen and (max-width: 768.5px) {.s-1-sr {font-size: 3.7vw;}}
@media screen and (max-width: 428.5px) {.s-1-sr {font-size: 4.0vw;}}
@media screen and (max-width: 390.5px) {.s-1-sr {font-size: 4.5vw;}}
@media screen and (max-width: 320.5px) {.s-1-sr {font-size: 5.0vw;}}


/*社労士用 小タイトル2*/

.s-2-sr {
  color:black;
  font-weight: bold;
  width: 100%;
  font-size: 23px;
}

@media screen and (max-width: 768.5px) {
  .s-2-sr {
    color:black;
    font-weight: bold;
    text-indent: 0;
    width: 100%;
    font-size: 2.8vw;
  }
}

@media screen and (max-width: 768.5px) {.s-2-sr {font-size: 2.6vw; text-indent: -1.2em; padding-left: 1.2em; line-height: 1.2em;}}
@media screen and (max-width: 428.5px) {.s-2-sr {font-size: 3.8vw; text-indent: -1.2em; padding-left: 1.2em; line-height: 1.2em;}}
@media screen and (max-width: 390.5px) {.s-2-sr {font-size: 4.6vw; text-indent: -1.2em; padding-left: 1.2em; line-height: 1.2em;}}
@media screen and (max-width: 320.5px) {.s-2-sr {font-size: 4.6vw; text-indent: -1.2em; padding-left: 1.2em; line-height: 1.2em;}}



/*宅建マーク*/

/*問題*/

.mondai{padding: 0px; margin-left: 0px; width: 100px;}
@media screen and (min-width: 1024px) {.mondai{width: 90px; margin-top: 10px;}}
@media screen and (max-width: 1023px) {.mondai{width: 90px; margin-top: 10px;}}
@media screen and (max-width: 950px) {.mondai{width: 80px; margin-top: 8px;}}
@media screen and (max-width: 768.5px) {.mondai{width: 75px; margin-top: 0px; padding-bottom: 4px;}}
@media screen and (max-width: 428.5px) {.mondai{width: 60px; margin-top: 0px; padding-bottom: 3px;}}
@media screen and (max-width: 390.5px) {.mondai{width: 55px; margin-top: 0x; padding-bottom: 3px;}}
@media screen and (max-width: 320.5px) {.mondai{width: 50px; margin-top: 0px; padding-bottom: 3px;}}


/*結論*/

.ketsuron{padding: 0px; margin-left: 0px; width: 100px;}
@media screen and (min-width: 1024px) {.ketsuron{width: 90px; margin-top: 10px;}}
@media screen and (max-width: 1023px) {.ketsuron{width: 90px; margin-top: 10px;}}
@media screen and (max-width: 950px) {.ketsuron{width: 80px; margin-top: 8px;}}
@media screen and (max-width: 768.5px) {.ketsuron{width: 75px; margin-top: 0px; padding-bottom: 4px;}}
@media screen and (max-width: 428.5px) {.ketsuron{width: 60px; margin-top: 0px; padding-bottom: 3px;}}
@media screen and (max-width: 390.5px) {.ketsuron{width: 55px; margin-top: 0x; padding-bottom: 3px;}}
@media screen and (max-width: 320.5px) {.ketsuron{width: 50px; margin-top: 0px; padding-bottom: 3px;}}


/*原則*/

.gensoku{padding: 0px; margin-left: 0px; width: 100px;}
@media screen and (min-width: 1024px) {.gensoku{width: 90px; margin-top: 10px;}}
@media screen and (max-width: 1023px) {.gensoku{width: 90px; margin-top: 10px;}}
@media screen and (max-width: 950px) {.gensoku{width: 80px; margin-top: 8px;}}
@media screen and (max-width: 768.5px) {.gensoku{width: 75px; margin-top: 0px; padding-bottom: 4px;}}
@media screen and (max-width: 428.5px) {.gensoku{width: 60px; margin-top: 0px; padding-bottom: 3px;}}
@media screen and (max-width: 390.5px) {.gensoku{width: 55px; margin-top: 0x; padding-bottom: 3px;}}
@media screen and (max-width: 320.5px) {.gensoku{width: 50px; margin-top: 0px; padding-bottom: 3px;}}


/*例外*/

.reigai{padding: 0px; margin-left: 0px; width: 100px;}
@media screen and (min-width: 1024px) {.reigai{width: 90px; margin-top: 10px;}}
@media screen and (max-width: 1023px) {.reigai{width: 90px; margin-top: 10px;}}
@media screen and (max-width: 950px) {.reigai{width: 80px; margin-top: 8px;}}
@media screen and (max-width: 768.5px) {.reigai{width: 75px; margin-top: 0px; padding-bottom: 4px;}}
@media screen and (max-width: 428.5px) {.reigai{width: 60px; margin-top: 0px; padding-bottom: 3px;}}
@media screen and (max-width: 390.5px) {.reigai{width: 55px; margin-top: 0x; padding-bottom: 3px;}}
@media screen and (max-width: 320.5px) {.reigai{width: 50px; margin-top: 0px; padding-bottom: 3px;}}


/*具体例*/

.gutairei{padding: 0px; margin-left: 0px; width: 100px;}
@media screen and (min-width: 1024px) {.gutairei{width: 90px; margin-top: 0px; padding-bottom: 3px}}
@media screen and (max-width: 1023px) {.gutairei{width: 90px; margin-top: 10px; padding-bottom: 3px}}
@media screen and (max-width: 950px) {.gutairei{width: 80px; margin-top: 8px;}}
@media screen and (max-width: 768.5px) {.gutairei{width: 75px; margin-top: 0px; padding-bottom: 5px;}}
@media screen and (max-width: 428.5px) {.gutairei{width: 60px; margin-top: 0px; padding-bottom: 4px;}}
@media screen and (max-width: 390.5px) {.gutairei{width: 55px; margin-top: 0x; padding-bottom: 4px;}}
@media screen and (max-width: 320.5px) {.gutairei{width: 50px; margin-top: 0px; padding-bottom: 5px;}}


/*ex*/

.ex{padding: 0px; margin-left: 0px; width: 40px;}
@media screen and (min-width: 1024px) {.ex{width: 36px; margin-top: 0px; padding-bottom: 5px;}}
@media screen and (max-width: 1023px) {.ex{width: 36px; padding-bottom: 2px;}}
@media screen and (max-width: 950px) {.ex{width: 32px; padding-bottom: 2px;}}
@media screen and (max-width: 768.5px) {.ex{width: 30px; margin-top: 0px; padding-bottom: 5px;}}
@media screen and (max-width: 428.5px) {.ex{width: 24px; margin-top: 0px; padding-bottom: 5px;}}
@media screen and (max-width: 390.5px) {.ex{width: 19px; margin-top: 0x; padding-bottom: 5px;}}
@media screen and (max-width: 320.5px) {.ex{width: 20px; margin-top: 0px; padding-bottom: 5px;}}


/*先取り*/

.sakidori{padding: 0px; margin-left: 0px; width: 160px; margin-bottom: 10px;}
@media screen and (min-width: 1024px) {.sakidori{width: 160px; margin-top: 10px;}}
@media screen and (max-width: 1023px) {.sakidori{width: 160px; margin-top: 10px;}}
@media screen and (max-width: 950px) {.sakidori{width: 140px; margin-top: 8px;}}
@media screen and (max-width: 768.5px) {.sakidori{width: 75px; margin-top: 7px;}}
@media screen and (max-width: 428.5px) {.sakidori{width: 100px;}}
@media screen and (max-width: 390.5px) {.sakidori{width: 100px;}}
@media screen and (max-width: 320.5px) {.sakidori{width: 100px;}}


/*法律用語*/

.horitsu{padding: 0px; margin-left: 0px; width: 160px; margin-bottom: 10px;}
@media screen and (min-width: 1024px) {.horitsu{width: 160px; margin-top: 10px;}}
@media screen and (max-width: 1023px) {.horitsu{width: 160px; margin-top: 10px;}}
@media screen and (max-width: 950px) {.horitsu{width: 140px; margin-top: 8px;}}
@media screen and (max-width: 768.5px) {.horitsu{width: 75px; margin-top: 7px;}}
@media screen and (max-width: 428.5px) {.horitsu{width: 100px;}}
@media screen and (max-width: 390.5px) {.horitsu{width: 100px;}}
@media screen and (max-width: 320.5px) {.horitsu{width: 100px;}}




/*補足説明*/

.hosoku{padding: 0px; margin-left: 0px; width: 160px; margin-bottom: 10px;}
@media screen and (min-width: 1024px) {.hosoku{width: 160px; margin-top: 10px;}}
@media screen and (max-width: 1023px) {.hosoku{width: 160px; margin-top: 10px;}}
@media screen and (max-width: 950px) {.hosoku{width: 140px; margin-top: 8px;}}
@media screen and (max-width: 768.5px) {.hosoku{width: 75px; margin-top: 7px;}}
@media screen and (max-width: 428.5px) {.hosoku{width: 100px;}}
@media screen and (max-width: 390.5px) {.hosoku{width: 100px;}}
@media screen and (max-width: 320.5px) {.hosoku{width: 100px;}}


/*余力があれば*/

.yoryoku{padding: 0px; margin-left: 0px; width: 160px; margin-bottom: 10px;}
@media screen and (min-width: 1024px) {.yoryoku{width: 160px; margin-top: 10px;}}
@media screen and (max-width: 1023px) {.yoryoku{width: 160px; margin-top: 10px;}}
@media screen and (max-width: 950px) {.yoryoku{width: 140px; margin-top: 8px;}}
@media screen and (max-width: 768.5px) {.yoryoku{width: 75px; margin-top: 7px;}}
@media screen and (max-width: 428.5px) {.yoryoku{width: 100px;}}
@media screen and (max-width: 390.5px) {.yoryoku{width: 100px;}}
@media screen and (max-width: 320.5px) {.yoryoku{width: 100px;}}


/*on point*/
.onepoint{padding: 0px; margin-left: 0px; width: 160px;}
@media screen and (min-width: 1024px) {.onepoint{width: 160px; margin-top: 10px;}}
@media screen and (max-width: 1023px) {.onepoint{width: 160px; margin-top: 10px;}}
@media screen and (max-width: 950px) {.onepoint{width: 140px; margin-top: 8px;}}
@media screen and (max-width: 768.5px) {.onepoint{width: 75px; margin-top: 7px;}}
@media screen and (max-width: 428.5px) {.onepoint{width: 100px;}}
@media screen and (max-width: 390.5px) {.onepoint{width: 100px;}}
@media screen and (max-width: 320.5px) {.onepoint{width: 100px;}}


/*参考条文*/

.sanko{padding: 0px; margin-left: 0px; width: 100px;}
@media screen and (min-width: 1024px) {.sanko{width: 140px; margin-top: 20px;}}
@media screen and (max-width: 1023px) {.sanko{width: 120px; margin-top: 20px;}}
@media screen and (max-width: 1023px) {.sanko{width: 120px; margin-top: 20px;}}
@media screen and (max-width: 768.5px) {.sanko{width: 120px; margin-top: 10px;}}
@media screen and (max-width: 428.5px) {.sanko{width: 100px;}}
@media screen and (max-width: 390.5px) {.sanko{width: 100px;}}
@media screen and (max-width: 320.5px) {.sanko{width: 100px;}}


/*ここをチェック*/

.check{padding: 0px; margin-left: 0px; width: 100px;}
@media screen and (min-width: 1024px) {.check{width: 140px; margin-top: 20px;}}
@media screen and (max-width: 1023px) {.check{width: 120px; margin-top: 20px;}}
@media screen and (max-width: 1023px) {.check{width: 120px; margin-top: 20px;}}
@media screen and (max-width: 768.5px) {.check{width: 120px; margin-top: 10px;}}
@media screen and (max-width: 428.5px) {.check{width: 80px;}}
@media screen and (max-width: 390.5px) {.check{width: 80px;}}
@media screen and (max-width: 320.5px) {.check{width: 80px;}}


/*改正*/

.kaisei{padding: 0px; margin-left: 0px; width: 60px;}
@media screen and (min-width: 1024px) {.kaisei{width: 60px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 1023px) {.kaisei{width: 60px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 800px) {.kaisei{width: 55px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 768.5px) {.kaisei{width: 65px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 700.5px) {.kaisei{width: 58px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 628.5px) {.kaisei{width: 50px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 528.5px) {.kaisei{width: 40px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 428.5px) {.kaisei{width: 50px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 390.5px) {.kaisei{width: 55px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 320.5px) {.kaisei{width: 50px; padding: 0px !important; margin: 0px !important;}}


/*前年改正*/

.zennen_kai{padding: 0px; margin-left: 0px; width: 40px;}
@media screen and (min-width: 1024px) {.zennen_kai{width: 40px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 1023px) {.zennen_kai{width: 40px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 800px) {.zennen_kai{width: 40px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 768.5px) {.zennen_kai{width: 45px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 700.5px) {.zennen_kai{width: 38px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 628.5px) {.zennen_kai{width: 30px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 528.5px) {.zennen_kai{width: 30px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 428.5px) {.zennen_kai{width: 35px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 390.5px) {.zennen_kai{width: 35px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 320.5px) {.zennen_kai{width: 35px; padding: 0px !important; margin: 0px !important;}}


/*新設*/

.shinsetsu{padding: 0px; margin-left: 0px; width: 60px;}
@media screen and (min-width: 1024px) {.shinsetsu{width: 60px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 1023px) {.shinsetsu{width: 60px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 800px) {.shinsetsu{width: 55px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 768.5px) {.shinsetsu{width: 65px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 700.5px) {.shinsetsu{width: 58px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 628.5px) {.shinsetsu{width: 50px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 528.5px) {.shinsetsu{width: 40px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 428.5px) {.shinsetsu{width: 50px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 390.5px) {.shinsetsu{width: 55px; padding: 0px !important; margin: 0px !important;}}
@media screen and (max-width: 320.5px) {.shinsetsu{width: 50px; padding: 0px !important; margin: 0px !important;}}




/*旧設定*/
.s_pc{ display: none !important;}
.s_pc835{ display: none !important;}
.s_pc800{ display: none !important;}
.s_tb3_992{ display: none !important;}
.s_tb3_991{ display: none !important;}
.s_tb3{ display: none !important;}
.s_tb2{ display: none !important;}
.s_tb1{ display: none !important;}
.s_xs3{ display: none !important;}
.s_xs2{ display: none !important;}
.s_xs{ display: none !important;}


/*1025以上表示*/
@media screen and (min-width: 1025px) { .s_pc{display: block !important;}}
/*835以上表示*/
@media screen and (min-width: 835px) {.s_pc835{display: block !important;}}
/*800以上表示*/
@media screen and (min-width: 800px) {.s_pc800{display: block !important;}}
/*992〜1024表示*/
@media screen and (min-width: 992px) and (max-width: 1024px) {.s_tb3_992{display: block !important;}}
/*835〜991表示*/
@media screen and (min-width: 835px) and (max-width: 991px) {.s_tb3_991{display: block !important;}}
/*835〜1024表示*/
@media screen and  (min-width: 835px) and (max-width: 1024px)  {.s_tb3{display: block !important;}}
/*769〜799表示*/
@media screen and (min-width: 769px) and (max-width: 799px) {.s_tb799{display: block !important;}}
/*769〜834表示*/
@media screen and (min-width: 769px) and (max-width: 834px) {.s_tb2{display: block !important;}}
/*721〜768表示*/
@media screen and (min-width: 721px) and (max-width: 768px) {.s_tb1{display: block !important;}}
/*414〜720表示*/
@media screen and (min-width: 401px) and (max-width: 720px) {.s_xs3{display: block !important;}}
/*321〜413表示*/
@media screen and (min-width: 321px) and (max-width: 400px) {.s_xs2{display: block !important;}}
/*320以下で表示*/
@media screen and (max-width:320px) {.s_xs{display: block !important;}}
/*1024以下で表示*/
@media screen and (max-width:1024px) {.s_pc_no{display: block !important;}}






/*新設定*/
.ns_pc{ display: none !important;}
.ns_tb4{ display: none !important;}
.ns_tb3{ display: none !important;}
.ns_tb2{ display: none !important;}
.ns_tb1{ display: none !important;}
.ns_xs{ display: none !important;}
.ns_xs3{ display: none !important;}
.ns_xs2{ display: none !important;}
.ns_xs1{ display: none !important;}


/*1025以上表示*/
@media screen and (min-width: 1025px) { .ns_pc{display: block !important;}}

/*769〜1024表示*/
@media screen and (min-width: 769px) and (max-width: 1024px) {.ns_tb4{display: block !important;}}
/*615〜768表示*/
@media screen and (min-width: 615px) and (max-width: 768px) {.ns_tb3{display: block !important;}}
/*515〜614表示*/
@media screen and (min-width: 515px) and (max-width: 614px) {.ns_tb2{display: block !important;}}
/*415〜514表示*/
@media screen and (min-width: 415px) and (max-width: 514px) {.ns_tb1{display: block !important;}}
/*414以下で表示*/
@media screen and (max-width:414px) {.ns_xs{display: block !important;}}
/*513以下で表示*/
@media screen and (min-width: 375px) and (max-width: 414px) {.ns_xs3{display: block !important;}}
/*414以下で表示*/
@media screen and (min-width: 321px) and (max-width: 374px) {.ns_xs2{display: block !important;}}
/*320以下で表示*/
@media screen and (max-width:320px) {.ns_xs1{display: block !important;}}



.no_border table {border: none!important;}
.no_border td {border: none!important;}


.ari_border td {border: solid 1px !important; padding: 6px}
.ari_border2 td {border-left: solid 1px !important; border-top: solid 1px !important; padding: 6px}

.ari_pad td {padding: 6px !important;}
.ari_pad2 td {padding: 3px !important;}
.ari_pad3 td {padding: 0px !important;}
.ari_pad4 td {padding: 2px !important;}
.ari_pad5 td {padding: 1px !important;}

/*テキストアラインセンター*/

.tcet td{text-align: center !important ;}


/*バーティカルアラインミドル*/

/*パソコン*/
.tvem td {vertical-align: middle !important;　/*line-height: 8px !important; font-size: 8px !important;*/ }




/*二列から１列変化*/

.two_one{text-align: center !important; width: 100% !important;}
@media screen and (max-width:1240px) {.two_one{text-align: left !important; width: 100% !important;}}

.two_one2{width: 450px !important; margin-left: 10px !important; margin-right: 10px !important;}
@media screen and (max-width:1000px) {.two_one2{width: 50% !important;}}
@media screen and (max-width:900px) {.two_one2{width: 60% !important;}}
@media screen and (max-width:800px) {.two_one2{width: 70% !important;}}
@media screen and (max-width:700px) {.two_one2{width: 80% !important;}}
@media screen and (max-width:600px) {.two_one2{width: 90% !important;}}
@media screen and (max-width:500px) {.two_one2{width: 100% !important; margin-left: 0px !important; margin-right: 0px !important;}}






/*本書の説明のグリッド*/


.infobox_bg{
	
width: 100%; 
background-color: #00b0ff;

}


@media (max-width: 2000px) {
  .infobox_bg {
    padding: 30px !important;
  }
}

@media (max-width: 940px) {
  .infobox_bg {
     padding: 20px !important;
  }
}

@media (max-width: 750px) {
  .infobox_bg {
     padding: 20px !important;
  }
}



.infobox {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

/* 画面の幅が800px以下の場合は3列に */
@media (max-width: 2000px) {
  .infobox {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* 画面の幅が600px以下の場合は2列に */
@media (max-width: 940px) {
  .infobox {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* 画面の幅が400px以下の場合は1列に */
@media (max-width: 750px) {
  .infobox {
    grid-template-columns: repeat(1, 1fr);
  }
}



/*白いボックスのCSS設定*/

.info_contents {
  background-color: white;
  border-radius: 10px; /* 角を丸く */
  padding: 20px; /* 内側の余白 */
  margin-bottom: 0px; /* ボックス同士の間隔 */
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /* 影をつける */
}

/*タイトル部分（薄ピンクの背景）*/

.info_title {
  line-height: 32px !important;	
  text-align: center;
  background-color: #ffe3e3; /* 薄ピンク色 */
  color: #e20303; /* タイトルテキスト色 */
  
  margin-bottom: 15px; /* タイトルと内容の間隔 */
  border-radius: 5px; /* 角を丸く */
  font-weight: bold !important; /* フォント太さ */
}


@media (max-width: 2000px) {
  .info_title {
    font-size: 21px !important;
	padding: 10px; /* タイトルのパディング */  
  }
}

@media (max-width: 900px) {
  .info_title {
     font-size: 23px !important;
	 padding: 10px; /* タイトルのパディング */ 
  }
}

@media (max-width: 750px) {
  .info_title {
     font-size: 19px !important;
	 padding: 10px; /* タイトルのパディング */ 
  }
}






/*画像部分のCSS設定*/

.info_image {
  width: 100%; /* ボックスに対して幅を100%に */
  height: auto; /* 高さは自動調整 */
  margin-bottom: 15px; /* 画像とテキストの間隔 */
}

/*
画像タグ(<img>)はHTMLに直接書くとすると、以下のようになります。
<img src="path-to-your-image.jpg" alt="説明テキスト" class="image">*/




/*テキスト部分のCSS設定*/

.info_text {
  color: #333; /* テキスト色 */
  margin-bottom: 15px; /* テキストの下の余白 */
  font-size: 16px; /* フォントサイズ */
  line-height: 1.5; /* 行間 */
}


/*青いボックス内のテキスト設定*/

.buleinfo_text {
  background-color: #92e8ff; /* 明るい青色 */
  color: #000; /* テキスト色は白 */
  padding: 10px; /* パディング */
  border-radius: 5px; /* 角を丸く */
  font-weight: normal; /* フォント太さ */
  font-size: 15px !important;	
}


/* 画面の幅が800px以下の場合は3列に */
@media (max-width: 2000px) {
  .buleinfo_text {
    margin-top: 30px;
  }
}

/* 画面の幅が600px以下の場合は2列に */
@media (max-width: 900px) {
  .buleinfo_text {
    margin-top: 20px;
  }
}

/* 画面の幅が400px以下の場合は1列に */
@media (max-width: 750px) {
  .buleinfo_text {
    margin-top: 10px;
  }
}




/* 追加するアニメーション効果 */
.info_image, .buleinfo_text {
  transition: opacity 0.2s ease-in-out;
  opacity: 1;
}

.info_image.hide, .buleinfo_text.hide {
  opacity: 0;
  display: block !important; /* JavaScriptが実行されるまで要素を隠さないようにする */
  pointer-events: none; /* 要素が透明の間はクリックを無視する */
}


/*ふわふわ動くアニメーション*/

.fuwafuwa {
  animation: fuwafuwa 3s ease-in-out infinite alternate;
	
/*個体のサイズを変更、現在は 250px auto に設定されているため、幅が250px、高さが自動で調整されている	*/
/*さらに	「center center」なので、画像はコンテナの中心に配置されている。これを画像を左に20px、中央から下に10pxの位置に移動させたい場合は、次のように設定
background-position: calc(50% - 20px) calc(50% + 10px);*/
  background: url("../images/kaisetu.svg") no-repeat center center / 185px auto;

  display: inline-block;
  transition: 1.5s ease-in-out;

/*以下は、要素のサイズ。ここでは、画像自体が背景なので、以下より背景が大きいとはみ出た分が表示されない。逆に小さいと、画像周辺に余白が生まれることになる。上記のno-repeat center centerの意味は、この余白において、左によったり上によったり、真ん中にしたりということである。*/
  width: 185px;
  height: 100px;
  margin-top: 10px;
}
 
@keyframes fuwafuwa {
  0% {
    transform:translate(0, 0) rotate(-7deg);
  }
  50% {
    transform:translate(0, -7px) rotate(0deg);
  }
  100% {
    transform:translate(0, 0) rotate(7deg);
  }
}


.fuwafuwa2 {
  animation: fuwafuwa 3s ease-in-out infinite alternate;
	
/*個体のサイズを変更、現在は 250px auto に設定されているため、幅が250px、高さが自動で調整されている	*/
/*さらに	「center center」なので、画像はコンテナの中心に配置されている。これを画像を左に20px、中央から下に10pxの位置に移動させたい場合は、次のように設定
background-position: calc(50% - 20px) calc(50% + 10px);*/
  background: url("../images/check.svg") no-repeat center center / 185px auto;

  display: inline-block;
  transition: 1.5s ease-in-out;

/*以下は、要素のサイズ。ここでは、画像自体が背景なので、以下より背景が大きいとはみ出た分が表示されない。逆に小さいと、画像周辺に余白が生まれることになる。上記のno-repeat center centerの意味は、この余白において、左によったり上によったり、真ん中にしたりということである。*/
  width: 185px;
  height: 100px;
  margin-top: 10px;
}
 
@keyframes fuwafuwa2 {
  0% {
    transform:translate(0, 0) rotate(-7deg);
  }
  50% {
    transform:translate(0, -7px) rotate(0deg);
  }
  100% {
    transform:translate(0, 0) rotate(7deg);
  }
}


.fuwafuwa3 {
  animation: fuwafuwa 3s ease-in-out infinite alternate;
	
/*個体のサイズを変更、現在は 250px auto に設定されているため、幅が250px、高さが自動で調整されている	*/
/*さらに	「center center」なので、画像はコンテナの中心に配置されている。これを画像を左に20px、中央から下に10pxの位置に移動させたい場合は、次のように設定
background-position: calc(50% - 20px) calc(50% + 10px);*/
  background: url("../images/kakomon.svg") no-repeat center center / 185px auto;

  display: inline-block;
  transition: 1.5s ease-in-out;

/*以下は、要素のサイズ。ここでは、画像自体が背景なので、以下より背景が大きいとはみ出た分が表示されない。逆に小さいと、画像周辺に余白が生まれることになる。上記のno-repeat center centerの意味は、この余白において、左によったり上によったり、真ん中にしたりということである。*/
  width: 185px;
  height: 100px;
  margin-top: 10px;
}
 
@keyframes fuwafuwa3 {
  0% {
    transform:translate(0, 0) rotate(-7deg);
  }
  50% {
    transform:translate(0, -7px) rotate(0deg);
  }
  100% {
    transform:translate(0, 0) rotate(7deg);
  }
}


.fuwafuwa4 {
  animation: fuwafuwa 3s ease-in-out infinite alternate;
	
/*個体のサイズを変更、現在は 250px auto に設定されているため、幅が250px、高さが自動で調整されている	*/
/*さらに	「center center」なので、画像はコンテナの中心に配置されている。これを画像を左に20px、中央から下に10pxの位置に移動させたい場合は、次のように設定
background-position: calc(50% - 20px) calc(50% + 10px);*/
  background: url("../images/aka.svg") no-repeat center center / 185px auto;

  display: inline-block;
  transition: 1.5s ease-in-out;

/*以下は、要素のサイズ。ここでは、画像自体が背景なので、以下より背景が大きいとはみ出た分が表示されない。逆に小さいと、画像周辺に余白が生まれることになる。上記のno-repeat center centerの意味は、この余白において、左によったり上によったり、真ん中にしたりということである。*/
  width: 185px;
  height: 100px;
  margin-top: 10px;
}
 
@keyframes fuwafuwa4 {
  0% {
    transform:translate(0, 0) rotate(-7deg);
  }
  50% {
    transform:translate(0, -7px) rotate(0deg);
  }
  100% {
    transform:translate(0, 0) rotate(7deg);
  }
}


.fuwafuwa5 {
 animation: fuwafuwa 3s ease-in-out infinite alternate;
/*個体のサイズを変更、現在は 250px auto に設定されているため、幅が250px、高さが自動で調整されている */
/*さらに 「center center」なので、画像はコンテナの中心に配置されている。これを画像を左に20px、中央から下に10pxの位置に移動させたい場合は、次のように設定
background-position: calc(50% - 20px) calc(50% + 10px);*/
 background: url("../images/series.svg") no-repeat center center / 185px auto;
 display: inline-block;
 transition: 1.5s ease-in-out;
/*以下は、要素のサイズ。ここでは、画像自体が背景なので、以下より背景が大きいとはみ出た分が表示されない。逆に小さいと、画像周辺に余白が生まれることになる。上記のno-repeat center centerの意味は、この余白において、左によったり上によったり、真ん中にしたりということである。*/
 width: 185px;
 height: 100px;
 margin-top: 10px;
}

@keyframes fuwafuwa5 {
 0% {
  transform:translate(0, 0) rotate(-7deg);
 }
 50% {
  transform:translate(0, -7px) rotate(0deg);
 }
 100% {
  transform:translate(0, 0) rotate(7deg);
 }
}

.fuwafuwa6 {
 animation: fuwafuwa 3s ease-in-out infinite alternate;
/*個体のサイズを変更、現在は 250px auto に設定されているため、幅が250px、高さが自動で調整されている */
/*さらに 「center center」なので、画像はコンテナの中心に配置されている。これを画像を左に20px、中央から下に10pxの位置に移動させたい場合は、次のように設定
background-position: calc(50% - 20px) calc(50% + 10px);*/
 background: url("../images/onsei.svg") no-repeat center center / 185px auto;
 display: inline-block;
 transition: 1.5s ease-in-out;
/*以下は、要素のサイズ。ここでは、画像自体が背景なので、以下より背景が大きいとはみ出た分が表示されない。逆に小さいと、画像周辺に余白が生まれることになる。上記のno-repeat center centerの意味は、この余白において、左によったり上によったり、真ん中にしたりということである。*/
 width: 185px;
 height: 100px;
 margin-top: 10px;
}

@keyframes fuwafuwa6 {
 0% {
  transform:translate(0, 0) rotate(-7deg);
 }
 50% {
  transform:translate(0, -7px) rotate(0deg);
 }
 100% {
  transform:translate(0, 0) rotate(7deg);
 }
}
