@charset "utf-8";


/*共通設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/


/*全体の設定
---------------------------------------------------------------------------*/
html {
	scroll-behavior: smooth;
}

body {
    margin: 0px;
    padding: 0px;
	color: #3F3F3F;	/*全体の文字色*/
	font-family: "Helvetica Neue", "Helvetica", "ヒラギノ角ゴ ProN W3", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;	/*フォント種類*/
	font-size: 28px;	/*文字サイズ*/
	line-height: 1.6;		/*行間*/
	-webkit-text-size-adjust: 100%;
	width: 100%;
}
h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure,form {margin: 0px;padding: 0px;}
ul {list-style-type: none;}
img {border: none;height: auto;}
iframe {width: 100%;}

input, select {
  -webkit-appearance: none;
  appearance: none;
}

input[type=checkbox] {
  -webkit-appearance:checkbox;
  appearance: checkbox;

}


*, *:before, *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box
}

:root {
--blue000: #205FA9;
--blue001: #036EB8;
--blue002: #036EB8;
--blue003: #D4E7FF;
--blue004: #e9f3ff;
--blue005: #EFF6FF;
--red001: #DC4155;
--red002: #DC6574;
--pink002:#FF6E69;
--pink003:#FF827E;
--pink004:#FFE5E4;
}


/*リンク（全般）設定
---------------------------------------------------------------------------*/
a {
}



/*コンテンツエリア
---------------------------------------------------------------------------*/

#contents{
width: 100%;
background: #f5f5f5;
position: relative;
overflow: hidden;
}

#main{
background: #f5f5f5;
}

.inner{
max-width: 750px;
margin: 0 auto;
box-sizing: border-box;
}




footer{
width: 100%;
text-align: center;
background-color: #333333;
color: white;
}

footer #footermenu{
background-color: #003F3F3F4;
overflow: hidden;
padding: 16px 8px;
}

footer #footermenu .inner{

}

footer #footermenu ul{
float: left;
width: 25%;
padding-left: 16px;
}

footer #footermenu ul li{
text-align: left;
text-decoration: none;

}

footer #footermenu ul li a{
font-size: 12px;
color: #fff;
}

footer #about{
padding: 8px 0px 0px;
}

footer #about a{
color: #fff;
font-size: 12px;
}

footer #copyright{
padding: 8px 0px;
font-size: 12px;
}

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

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



span.star_gold{
color: #ffd700;
}

span.star_gray{
color: #999;
}

span.score{
color: #ff6347;
font-family: 'Anton', sans-serif, cursive;
}


.sp{
display: none;
}

/*header
---------------------------------------------------------------------------*/

header{
width: 100%;
}

.header-wrap{
display: flex;
justify-content: flex-end;
align-items: center;
padding: 32px 32px 32px;
background: #fff;
}

.header-wrap img.logo{
    
}

a.logo_wrap{
position: absolute;
left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

header .btn-wrap {
    display: flex;
}

header .btn-wrap a{
display: block;
margin: 0 15px 0 0;
padding: 0 15px 15px 15px;
position: relative;
white-space: nowrap;
font-size: 15px;
text-decoration: none;
color: #3F3F3F;
}

header .btn-wrap a i{
margin: 0 10px 0 0;
color: var(--blue001);
}

header .btn-wrap a.common i{
color: #3F3F3F;
}

header .btn-wrap a:last-child{
margin: 0;
}

header .btn-wrap a:after{
position: absolute;
bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
z-index: 100;
color: #666;
font-size: 14px;
font-weight: bold;
}


.hamburger-menu{
  display: flex;
  align-items: center;
  width: 48px;
  height: 48px;
  cursor: pointer;
  z-index: 100;
}

.hamburger-menu__line{
  display: block;
  width: 100%;
  height: 4px;
  border-radius: 4px;
  background-color: var(--blue002);
  position: relative;
  transition: all 0.5s;
}

.hamburger-menu__line::before,
.hamburger-menu__line::after{
  content: '';
  display: block;
  width: 100%;
  height: 4px;
  border-radius: 4px;
  background-color: var(--blue002);
  position: absolute;
  transition: all 0.5s;
}

.hamburger-menu__line::before{
  transform: translateY(-18px);
}
.hamburger-menu__line::after{
  transform: translateY(18px);
}

.hamburger-menu.open .hamburger-menu__line{
  background-color: transparent;
}
.hamburger-menu.open .hamburger-menu__line::before{
  transform: rotate(45deg);
}
.hamburger-menu.open .hamburger-menu__line::after{
  transform: rotate(-45deg);
}

/* ナビゲーション */
.nav-sp{
  position: absolute;
  top: 0;
  right: -40vw;
  width: 40vw;
  height: 200vh;
  padding: 60px 10px 0;
  background-color: rgba(255,255,255,0.85);
  text-align: left;
  transition: right 0.5s;
  z-index: 5;
}

.nav-sp.open{
  right: 0;
}

.nav-sp a{
  display: inline-block;
  padding: 5px 0;
}

html.is-fixed,html.is-fixed body {
    height: 100%;
    overflow: hidden;
  }
  
#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  right: 20px;
  bottom: 20px;
  background: #3f98ef;
  opacity: 0.8;
  border-radius: 50%;
}
#page_top a{
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}

#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f106';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: -15px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}

.nav_li_label{
margin: 0 0 10px;
font-size: 21px;
}

/*fv
----------------------------------------------------------------------*/

section.fv{
margin: 0 0 40px;
}

.fv_inner{
width: 100%;
background-image: url(../images/20s_fv_index00.png);
background-repeat: no-repeat;
padding: 325px 20px 0;
position: relative;
}

.fv_inner_area{
width: 100%;
background-image: url(../images/kango_areafv_01.png);
background-repeat: no-repeat;
padding: 300px 0 0;
position: relative;
}

.fv_inner_category{
width: 100%;
background-repeat: no-repeat;
padding: 350px 0 0;
position: relative;
}

.fv_inner_top{
width: 100%;
background-repeat: no-repeat;
padding: 300px 0px 0;
position: relative;
}

.fv_inner_top02{
width: 100%;
background-repeat: no-repeat;
padding: 450px 0px 0;
position: relative;
}

.fv_inner_lp{
width: 100%;
background-repeat: no-repeat;
padding: 330px 0px 0;
position: relative;
}

img.fv_kv{
width: 100%;
}

.fv_area_text{
position: absolute;
font-size: 42px;
line-height: 1;
width: 230px;
text-align: center;
top: 136px;
left: 34px;
font-family: 'Mochiy Pop P One', sans-serif;
}

img.fv_agent_button{
width: 100%;
}

a.fv_agent_button_wrap{
margin: 40px 0 0;
display: inline-block;
}

img.fv_haken_button{
width: 100%;

}

a.fv_haken_button_wrap{
margin: 40px 0 0;
display: inline-block;
}

a.fv_game_button_wrap{
margin: 40px 0 0;
display: inline-block;
}

.fv_looplogo{
display: flex;
height: 80px;
width: 750px;
overflow: hidden;
margin: 0 0 30px;
}

.fv_inner_top02 .fv_looplogo{
margin: 0 0 20px;
border-bottom: solid 1px #ccc;
}



img.fv_looplogo_images{
width: auto;
height: 100%;
}

.fv_looplogo img.fv_looplogo_images:first-child{
animation: slide1 60s -30s linear infinite;
}

.fv_looplogo img.fv_looplogo_images:last-child{
animation: slide2 60s 0s linear infinite;
}

@keyframes slide1 {
  0% {
    transform: translateX(100%);
  }
  to {
    transform: translateX(-100%);
  }
}
 
@keyframes slide2 {
  0% {
    transform: translateX(0);
  }
  to {
    transform: translateX(-200%);
  }
}

.fv_inner_top section.search_step{
width: calc(100% - 40px);
margin: 0 auto 20px;
}

.fv_top_menu{
display: flex;
flex-wrap: wrap;
padding: 0 20px;
}

a.fv_top_menu_item{
display: block;
text-decoration: none;
color: #3F3F3F;
font-size: 20px;
text-align: center;
flex-basis: calc(50% - 10px);
position: relative;
line-height: 1.2;
padding: 20px 50px 20px 0;
background: #fff;
border-radius: 8px;
border: solid 2px #e5e5e5;
}

a.fv_top_menu_item:after{
position: absolute;
content: '';
display: inline-block;
width: 36px;
height: 36px;
background-image: url(../images/20s_top_menu_link_icon01.png);
background-size: contain;
background-repeat: no-repeat;
right: 12px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);

}

a.fv_top_menu_item:nth-child(odd){
margin: 0 10px 20px 0;
}

a.fv_top_menu_item:nth-child(even){
margin: 0 0 20px 10px;
}

a.fv_top_menu_item:nth-child(odd):nth-last-child(2),.fv_top_menu_item:nth-child(even):last-child,.fv_top_menu_item:nth-child(odd):last-child{
margin-bottom: 0;
}


a.fv_top_menu_item span.__title{
display: block;
font-weight: bold;
font-size: 36px;
}

a.fv_top_menu_item.__column1{
flex-basis: 100%;
margin: 0;
}

a.fv_top_menu_item.__column1:after{
background-image: url(../images/20s_top_menu_link_icon02.png);
}

.fv_top_menu02{
display: flex;
flex-wrap: wrap;
padding: 0 20px;
margin: 20px 0 0;
}

a.fv_top_menu02_item{
display: block;
text-decoration: none;
color: #3F3F3F;
font-size: 20px;
text-align: center;
flex-basis: calc(50% - 10px);
border: solid 2px #4fa2c0;
background: #fff;
position: relative;
line-height: 1.2;
padding: 20px;
border-radius: 0px;
box-shadow: 2px 4px 0 #4fa2c0;
}

a.fv_top_menu02_item:after{
position: absolute;
display: inline-block;
content: '';
width: 44px;
height: 12px;
background-image: url(../images/20s_top_menu02_item.png);
background-size: contain;
background-repeat: no-repeat;
bottom: 10px;
right: 10px;
}

a.fv_top_menu02_item.__border_gray:after{
background-image: url(../images/20s_top_menu02_item_brown.png);
}

a.fv_top_menu02_item.__border_gray{
border: solid 2px #9A938A;
box-shadow: 2px 4px 0 #9A938A;
}

a.fv_top_menu02_item:nth-child(odd){
margin: 0 10px 20px 0;
}

a.fv_top_menu02_item:nth-child(even){
margin: 0 0 20px 10px;
}

a.fv_top_menu02_item:nth-child(odd):nth-last-child(2),.fv_top_menu02_item:nth-child(even):last-child,.fv_top_menu02_item:nth-child(odd):last-child{
margin-bottom: 0;
}


a.fv_top_menu02_item span.__title{
display: block;
font-weight: bold;
font-size: 36px;
}

a.fv_top_menu02_item span.__color01{
color: #2BB3ED;
}

a.fv_top_menu02_item span.__color02{
color: #2C85ED;
}

a.fv_top_menu02_item span.__color03{
color: #2A84ED;
}

a.fv_top_menu02_item span.__color04{
color: #1E5EA9;
}

a.fv_top_menu02_item span.__color05{
color: #38B876;
}

a.fv_top_menu02_item span.__color06{
color: #9A7D58;
}


.fv_pr{
position: absolute;
font-size: 32px;
color: var(--blue002);
right: 10px;
top: 10px;
line-height: 1;
padding: 5px 10px;
border: solid 2px var(--blue002);
border-radius: 10px;
background: var(--blue004);
}

.fv_inner_student .fv_pr{
color: #FE843C;
border: solid 2px #FE843C;
background: #FEEDE3;
}

.fv_inner_top .fv_pr{
top: 242px;
background: #fff;
}

.fv_inner_lp .fv_pr{
top: 274px;
background: #fff;
}

ul.fv_tags{
display: flex;
flex-wrap: wrap;
padding: 0 20px;
margin: 40px 0 -10px;
justify-content: center;
}

ul.fv_tags li{
display: inline-block;
line-height: 1;
padding: 10px 15px;
background: var(--blue000);
color: #fff;
border-radius: 10px;
margin: 0 10px 10px 0;
font-size: 28px;
font-weight: bold;
}

ul.fv_tags li:before{
content: '#';
margin: 0 8px 0 0;
}

.fv_inner_student{
text-align: center;
}

.fv_anchor_wrap{
display: flex;
flex-wrap: wrap;
padding: 20px 0px 0;
justify-content: center;
}

a.fv_anchor_item{
position: relative;
display: inline-block;
text-decoration: none;
color: var(--blue001);
font-weight: bold;
background: #fff;
line-height: 1;
padding: 15px 44px 15px 20px;
border-radius: 100px;
border: solid 4px var(--blue001);
margin: 0 10px 10px 0;
box-shadow: 0px 2px 4px rgb(0 0 0 / 30%);
}

a.fv_anchor_item:after{
position: absolute;
content: '\f13a';
font-family: "Font Awesome 5 Free";
font-weight: 900;
right: 10px;
}

.fv_anchor02_wrap{
margin: 40px 0 0;
display: flex;
flex-wrap: wrap;
}

a.fv_anchor02_item{
position: relative;
flex-basis:calc(50% - 8px);
display: block;
text-decoration: none;
font-weight: bold;
font-size: 26px;
color: #fff;
background: linear-gradient(to left, #17467b 0%, #17467b 40px, var(--blue000) 40px, var(--blue000) 100%);
padding: 16px 56px 16px 16px;
border-radius: 10px;
box-shadow: 0px 2px 4px rgb(0 0 0 / 30%);
}

a.fv_anchor02_item:after{
position: absolute;
content: '\f13a';
font-family: "Font Awesome 5 Free";
font-weight: 900;
font-size: 22px;
right: 8px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}

.fv_anchor02_wrap a.fv_anchor02_item:nth-child(odd){
margin: 0 8px 0 0;
}

.fv_anchor02_wrap a.fv_anchor02_item:nth-child(even){
margin: 0 0 0 8px;
}

.fv_anchor02_wrap a.fv_anchor02_item:not(:first-child,:nth-child(2)){
margin-top: 16px;
}

a.fv_anchor02_item span.__title{
display: block;
line-height: 1;
margin: 0 0 16px;
}

a.fv_anchor02_item span.__title:after{
    content: '\f101';
    font-family: "Font Awesome 5 Free";
    font-weight: 700;
    font-size: 20px;
    margin: 0 0 0 10px;
vertical-align: -2px;
opacity: 0.6;
}

a.fv_anchor02_item ul.__list{
font-size: 20px;
padding: 8px 8px 8px 36px;
background: #FFF9ED;
border-radius: 8px;
}

a.fv_anchor02_item ul.__list li{
color: #3F3F3F;
position: relative;
line-height: 1.25;
margin: 0 0 8px;
}

a.fv_anchor02_item ul.__list li:before{
    position: absolute;
    content: '\f058';
    font-family: "Font Awesome 5 Free";
    font-weight: 700;
    color: #F8B62D;
    left: -26px;
}

a.fv_anchor02_item ul.__list li:last-child{
margin-bottom: 0;
}

.fv_notice{
    margin: 24px auto 0px;
    width: calc(100% - 20px);
    padding: 10px;
    border: solid 4px #00a8a8;
    border-radius: 0px;
    text-align: center;
    background-color: #fff;
    box-shadow: 0px 2px 4px rgb(0 0 0 / 30%);
    background-image: linear-gradient(0deg, transparent calc(100% - 1px), #f0f0f0 calc(100% - 1px)),
                    linear-gradient(90deg, transparent calc(100% - 1px), #f0f0f0 calc(100% - 1px));
    background-size: 16px 16px;
    background-repeat: repeat;
    background-position: center center;
    color: #666;
}

.fv_notice.__rt{
border: solid 4px #9597c7;
}

.fv_notice.__mt{
border: solid 4px #5f98f9;
}

p.fv_notice_description{
font-weight: bold;
}

p.fv_notice_description span.__color01{
color: #FF4500;
}


/*compare
----------------------------------------------------------------------*/

#compare{
margin: 0 0 60px 0;
}

#compare .tab-wrap {
  display: flex;
  flex-wrap: wrap;
  margin:20px 0 0;
}
#compare .tab-wrap:after {
  content: '';
  width: 100%;
  height: 3px;
  background: var(--blue002);
  display: block;
  order: -1;
}
#compare .tab-label {
  color: White;
  background: LightGray;
  font-weight: bold;
  text-shadow: 0 -1px 0 rgba(0,0,0,.2);
  white-space: nowrap;
  text-align: center;
  padding: 10px .5em;
  order: -1;
  position: relative;
  z-index: 1;
  cursor: pointer;
  border-radius: 5px 5px 0 0;
  flex: 1;
}
#compare .tab-label:not(:last-of-type) {
  margin-right: 5px;
}
#compare .tab-content {
  width: 100%;
  height: 0;
  overflow: hidden;
  opacity: 0;
}
/* アクティブなタブ */
#compare .tab-switch:checked+.tab-label {
  background: var(--blue002);
}
#compare .tab-switch:checked+.tab-label+.tab-content {
  height: auto;
  overflow: auto;
  padding: 20px;
  opacity: 1;
  transition: .5s opacity;
  background: #fff;
border-radius: 0 0 10px 10px;
}
/* ラジオボタン非表示 */
#compare .tab-switch {
  display: none;
}

table.compare_table{
width: 100%;
font-size: 20px;
color: #666;
border-collapse: collapse;
}

table.compare_table th,table.compare_table td{
border: solid 1px #ddd;
}

table.compare_table th{
font-size: 20px;
padding: 12px 0 10px;
background: var(--blue002);
color: #fff;
}

table.compare_table td{
text-align: center;
padding: 10px 10px;
background: #fff;
}

table.compare_table tr:nth-child(2) td:nth-child(1){
position: relative;
padding: 20px 20px 10px;
}

table.compare_table th:nth-child(2),table.compare_table th:nth-child(3),table.compare_table th:nth-child(4){
width: calc((710px - 320px) / 3);
}

table.compare_table td.ev01{
background: url(../images/hoiku_compare_icon01.png);
}

table.compare_table td.ev02{
background: url(../images/hoiku_compare_icon02.png);
}

table.compare_table td.ev03{
background: url(../images/hoiku_compare_icon03.png);
}

table.compare_table td.ev01,table.compare_table td.ev02,table.compare_table td.ev03{
background-repeat: no-repeat;
background-size: 100px;
background-position: center;
background-color:rgba(255,255,255,0.5);
background-blend-mode:lighten;
text-shadow: 2px 2px 0 #fff,2px 0px 0 #fff,0px 2px 0 #fff,0px -2px 0 #fff,-2px 0px 0 #fff,-2px 2px 0 #fff,2px -2px 0 #fff,-2px -2px 0 #fff;
}


table.compare_table th:nth-child(1){
width: 320px;
}

img.compare_table_logo{
width: 280px;
}

a.compare_table_logo_wrap{
display: block;
}

a.compare_table_linkbutton{
display: block;
background: #ff3300;
color: #fff;
padding: 10px 0px;
text-decoration: none;
border-radius: 10px;
width: 240px;
margin: 0 auto 5px;
position: relative;
overflow: hidden;
font-size: 20px;
text-align: center;
font-weight: bold;
box-shadow: 0 5px 0 #B62400;
}

a.compare_table_linkbutton:after{
 content: "";
  display: block;
  width: 20px;
  height: 100%;
  position: absolute;
  top: -180px;
  left: 0;
  background-color: #FFF;
  opacity: 0;
  transform: rotate(45deg);
  animation: reflect 2s ease-in-out infinite;
  -webkit-transform: rotate(45deg);
  -webkit-animation: reflect 2s ease-in-out infinite;
}

@keyframes reflect {
  0% { transform: scale(0) rotate(45deg); opacity: 0; }
  80% { transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { transform: scale(4) rotate(45deg); opacity: 1; }
  100% { transform: scale(50) rotate(45deg); opacity: 0; }
}
@-webkit-keyframes reflect {
  0% { transform: scale(0) rotate(45deg); opacity: 0; }
  80% { transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { transform: scale(4) rotate(45deg); opacity: 1; }
  100% { transform: scale(50) rotate(45deg); opacity: 0; }
}

a.compare_table_textlink{
font-size: 20px;
    position: relative;
    font-weight: bold;
    display: block;
}

a.compare_table_textlink:after{
    content: '\f35d';
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 18px;
    margin: 0 0 0 5px;
}

.compare_table_score{
font-size: 28px;
font-family: 'Anton', sans-serif, cursive;
color: #ff4b4b;
}

.compare_table_score i{
color: #FFD700;
vertical-align: 4px;
}

a.compare_table_review{
display: inline-block;
margin: 5px 0 0;
text-decoration: none;
font-size: 20px;
color: #9AC5ED;
font-weight: bold;
}

span.compare_table_review_span{
text-decoration: underline;
}


a.compare_table_review:before{
  font-family: "Font Awesome 5 Free";
  content: "\f4ad";
  font-weight: 900;
  margin: 0 5px 0 0;
}

span.compare_table_amount_span{
font-size: 24px;
font-weight: bold;
color: #222;
}

span.compare_table_area_span{
font-size: 28px;
font-weight: bold;
color: #222;
}

span.compare_table_age_span{
  font-size: 24px;
font-weight: bold;
color: #222;
}

.compare_table_td_label_wrap{
position: absolute;
top:0;
left:0;
}

.compare_table_td_label{
font-size: 20px;
height: 32px;
line-height: 1;
padding: 4px 0px 8px 10px;
color: #fff;
background: #CAA846;
text-shadow: none;
position: relative;
font-weight: bold;
text-shadow: 0 -2px 0 #B58B11;
}

.compare_table_td_label i{
font-size: 18px;
vertical-align: 2px;
color: #DEC784;
}

.compare_table_td_label:after{
position: absolute;
content: '';
top: 0;
right: -18px;
width: 0;
height: 0;
border-style: solid;
border-width: 32px 18px 0 0;
border-color: #CAA846 transparent transparent transparent;
}

p.compare_table_addition{
margin: 10px 0 0;
font-size: 20px;
color: #888;
}


#compare #recommend{

}

#compare #recommend .row{
margin: 0 0 30px;
}

#compare #recommend .row:last-child{
margin: 0;
}

#compare #recommend .recommend-box{
position: relative;
padding: 30px;
}


#compare #recommend .recommend-box:before{
border-left: solid 2px var(--blue002);
border-top: solid 2px var(--blue002);
top: 0;
left: 0;
}

#compare #recommend .recommend-box:after{
border-right: solid 2px var(--blue002);
border-bottom: solid 2px var(--blue002);
bottom: 0;
right: 0;
}

#compare #recommend .recommend-box:before, #compare #recommend .recommend-box:after{
    content: '';
    width: 40px;
    height: 40px;
    position: absolute;
}

#compare #recommend .recommend-box .logo{
display: block;
margin: 0 auto 0;
width: calc(100% - 20px);
}

#compare #recommend .recommend-box a.txtlink{
display: block;
text-align: center;
font-size: 18px;
margin: 0 0 15px;
}

#compare #recommend .recommend-box a.txtlink:before{
  font-family: "Font Awesome 5 Free";/*忘れずに*/
  content: "\f35d";/*アイコンのユニコード*/
  font-weight: 900;
  margin-right: 5px;
}

#compare #recommend .recommend-box .title{
font-size: 30px;
text-align: center;
position: relative;
}

#compare #recommend .recommend-box .title:before{

display: inline-block;
content:'';
background: url(../images/hoiku_recommend-title_icon.png);
background-size: cover;
width: 24px;
height: 32px;
vertical-align: 12px;
margin-right: 4px;

}

#compare #recommend .recommend-box .title span.color{
color: var(--blue002);
font-weight: 500;
}

#compare #recommend .recommend-box p{
font-weight: bold;
font-size: 24px;
}

.compare_lp_tablewrap{

}

h2.compare_lp_h2{
font-size: 32px;
background: linear-gradient(to bottom,#236ABD,var(--blue000));
color: #fff;
border-radius: 10px 10px 0 0 ;
line-height: 1;
padding: 30px 0;
text-align: center;
}

h2.compare_lp_h2 span.__orange{
color: #FFB92E;
}

p.compare_table_copy{
font-weight: bold;
background: #f5f5f5;
color: #222;
padding: 10px;
position: relative;
border: solid 1px var(--red002);
font-size: 22px;
box-shadow: 0px 2px 4px rgb(0 0 0 / 20%);
}

p.compare_table_copy:before,p.compare_table_copy:after{
    content: "";
    display: block;
    left: -2px;
    position: absolute;
    top: -2px;
}

p.compare_table_copy:before{
border-right: 20px solid transparent;
border-top: 20px solid #fff;
z-index: 2;
}

p.compare_table_copy:after{
border-bottom: 20px solid var(--red002);
border-left: 20px solid transparent;
}

p.compare_table_copy span.__inlineblock{
display: inline-block;
}

a.compare_table_linkbutton02{
text-decoration: none;
display: block;
color: #fff;
font-weight: bold;
font-size: 22px;
background: #FF5800;
box-shadow: 0px 6px 0px #913200;
padding: 10px 0;
line-height: 1.25;
border-radius: 10px;
position: relative;
overflow: hidden;
}

a.compare_table_linkbutton02:after{
 content: "";
  display: block;
  width: 20px;
  height: 100%;
  position: absolute;
  top: -180px;
  left: 0;
  background-color: #FFF;
  opacity: 0;
  transform: rotate(45deg);
  animation: reflect 2s ease-in-out infinite;
  -webkit-transform: rotate(45deg);
  -webkit-animation: reflect 2s ease-in-out infinite;
}

.compare_lp_tablewrap table.compare_table th:nth-child(2),.compare_lp_tablewrap table.compare_table th:nth-child(3),.compare_lp_tablewrap table.compare_table th:nth-child(4){
width: calc((750px - 320px) / 3);
}

 .compare_lp_tablewrap a.compare_table_textlink{
 margin: 0 0 10px;
 display: inline-block;
 }

.compare_lp_tablewrap table.compare_table tr td:nth-child(1){
padding: 20px;
}

.compare_lp_tablewrap table.compare_table th,.compare_lp_tablewrap table.compare_table td{
border: solid 1px #bbb;
}

.compare_lp_tablewrap table.compare_table th{
background: var(--blue003);
color: #3F3F3F;
}

p.comparison_table_notice{
margin: 10px 0 0;
font-size: 20px;
color: #666;
}

ul.compare_occupation_list{
display: inline-block;
padding: 0 0 0 24px;
}

ul.compare_occupation_list li{
text-align: left;
position: relative;
line-height: 1;
margin: 0 0 12px;
white-space: nowrap;
}

ul.compare_occupation_list li:last-child{
margin: 0;
}


ul.compare_occupation_list li:before{
position: absolute;
content: '';
width: 28px;
height: 20px;
left: -32px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
background-repeat: none;
background-size: contain;
}

ul.compare_occupation_list li.__occupation01:before{
background-image: url(../images/20s_compare_occupation_lable_icon01.png);
}

ul.compare_occupation_list li.__occupation02:before{
background-image: url(../images/20s_compare_occupation_lable_icon02.png);
}

ul.compare_occupation_list li.__occupation03:before{
background-image: url(../images/20s_compare_occupation_lable_icon03.png);
}

ul.compare_occupation_list li.__occupation04:before{
background-image: url(../images/20s_compare_occupation_lable_icon04.png);
}

ul.compare_occupation_list li.__occupation05:before{
background-image: url(../images/20s_compare_occupation_lable_icon05.png);
}

ul.compare_occupation_list li.__occupation06:before{
background-image: url(../images/20s_compare_occupation_lable_icon06.png);
}
.compare_lp_tablewrap table.compare_table.__table_haken th:nth-child(1){
width: 180px;
}

.compare_lp_tablewrap table.compare_table th:nth-child(2), .table.compare_table.__table_haken th:nth-child(3), table.compare_table.__table_haken th:nth-child(4) {
    width: calc((750px - 180px) / 4);
}

.compare_lp_tablewrap table.compare_table.__table_haken tr td:nth-child(1){
padding: 12px;
}

.compare_lp_tablewrap table.compare_table.__table_haken.__table_driver tr td:nth-child(1){
padding: 36px 12px;
}

table.compare_table.__table_haken img.compare_table_logo {
width: 100%;
}

p.compare_table_feature_text{
font-weight: bold;
color: #222;
text-align: left;
font-size: 20px;
}

table.compare_table.__table_haken a.compare_table_textlink:after{
  display: none;;
}

table.compare_table.__table_haken tr:nth-child(-n+3) .orangeline {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, transparent), color-stop(50%, #FFDE7F), color-stop(90%, #FFDE7F), color-stop(90%, transparent));
    background: linear-gradient(transparent 50%, #FFDE7F 50%, #FFDE7F 90%, transparent 90%);
    position: relative;
    padding: .1rem .2rem;
    color: #000;
}

p.add_amount {
    position: relative;
    padding-top: 30px;
    font-size: 20px;
    color: #222;
    font-weight: 900;
    transform: scale(100%);
    line-height: 1.25;
}

p.add_amount::after {
    position: absolute;
    color: #666;
    font-size: 40px;
    top: -10px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    font-family: "Font Awesome 5 Free";
    content: "\2b";
}

p.add_amount u {
    text-decoration: none;
    /*background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, transparent), color-stop(50%, #FFDE7F), color-stop(90%, #FFDE7F), color-stop(90%, transparent));
    background: linear-gradient(transparent 50%, #FFDE7F 50%, #FFDE7F 90%, transparent 90%);*/
    position: relative;
    padding: 0;
}

table.compare_table.__table_haken tr:nth-of-type(2) p.add_amount u {
    color: #ff4b4b;
}

img.add_crown{
width: clamp(1rem, 5.35vw, 2.3rem);
}

img.compare_ev_icon {
    width: 44px;
}

.compare_amount_text {
  font-size: 20px;
  position: relative; /* 疑似要素の基準点 */
  padding: 8px;
  background: #ffeddb;
  border-radius: 4px;
  line-height: 1.25;
  transform: scale(0.9);
  color: #111;
  font-weight: bold;
  margin-top: 16px;
}

.compare_amount_text::after {
  content: '';
  position: absolute;
  top: -14px; /* 吹き出し本体の下端から下に配置 */
  left: 50%;
  transform: translateX(-50%); /* 中央揃え */
  border-width: 0 8px 16px 8px;
  border-style: solid;
  border-color: transparent transparent #ffeddb transparent; /* 上だけ色を付ける */
}

table.compare_table.__table_haken td.__td_amount {
padding: 10px 0;
}

.compare_tab_wrap {
  display: flex;
  flex-wrap: wrap;
  margin:20px 0 0;
  padding: 0 32px;
}

.tab_compare_label {
  color: White;
  background: #aaa;
  font-weight: bold;
  text-shadow: 0 -1px 0 rgba(0,0,0,.2);
  white-space: nowrap;
  text-align: center;
  padding: 20px 0;
  order: -1;
  position: relative;
  z-index: 1;
  cursor: pointer;
  border-radius: 16px;
  flex: 1;
  font-size: 36px;
}

.tab_compare_label span.__small{
}

.tab_compare_label:not(:last-of-type) {
  margin-right: 16px;
}
.tab_compare_content {
  width: 100%;
  height: 0;
  overflow: hidden;
  opacity: 0;
}
/* アクティブなタブ */
.tab_compare_switch:checked+.tab_compare_label {
  background: #28B6D6;
}

.tab_compare_switch:checked+.tab_compare_label:nth-of-type(2) {
  
}

.tab_compare_switch:checked+.tab_compare_label+.tab_compare_content {
  height: auto;
  overflow: auto;
  display: grid;
gap: 32px;
padding: 32px 0px 0px;
  opacity: 1;
  transition: .5s opacity;
border-radius: 0 0 10px 10px;

}
/* ラジオボタン非表示 */
.tab_compare_switch {
  display: none;
}

.tab_compare_content{
}

.tab_compare_switch:checked+.tab_compare_label+.tab_compare_content.tab_compare_2{

}

.compare_tab_baloon{
display: inline-block;
font-weight: bold;
position: relative;
line-height: 1;
}

.compare_tab_baloon:before,.compare_tab_baloon:after{
position: absolute;
bottom: 0;
height: 2rem;
content: '';
}

.compare_tab_baloon:before{
border-left: solid 4px #888;
left: -20px;
transform: rotate(-20deg);
}

.compare_tab_baloon:after{
border-right: solid 4px #888;
right: -20px;
transform: rotate(20deg);
}

.compare_occupation__title{
font-weight: bold;
font-size: 32px;
text-align: center;
line-height: 1;
}

.compare_occupation__title span.__strong{
display: inline-block;
background: #28B6D6;
color: #fff;
line-height: 1;
padding: 12px 16px;
margin: 0 8px;
border-radius: 12px;
}

.compare_occupation dl dt{
padding: 12px;
font-size: 24px;
background: #135A6A;
color: #fff;
text-align: center;
}

.compare_occupation dl dt span.__strong{
color: #FFB92E;
font-weight: bold;
}

.compare_occupation dl dd{
padding: 16px;
font-size: 24px;
background: #f0f0f0;
}

.compare_occupation dl dd ul{
display: grid;
grid-template-columns: 50% 50%;
place-items: center;
gap: 12px 0;
}

.compare_occupation dl dd ul li{
text-align: left;
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 5px;
font-weight: bold;
font-size: 22px;
}

.compare_occupation dl dd ul li:before{
font-family: "Font Awesome 5 Free";content: "\f0da";
}

img.compare_arrow_image{
display: block;
width: 80px;
margin: auto;
}

.compare_tab_title{
font-size: 32px;
font-weight: bold;
text-align: center;
width: calc(100% - 64px);
margin: 0 auto 0;
background: linear-gradient(transparent 48%, #28B6D6 49%, #28B6D6 52%, transparent 52%);
}

span.__lightgray{
background-color: #f5f5f5;
padding: 0 8px;
}

/*sample
----------------------------------------------------------------------*/

section.sample{
padding: 0 20px;
margin: 0 0 60px;
}

h2.sample_h2{
 display: block;
 width: 100%;
  position: relative;
  height: 60px;
  line-height: 1;
  text-align: center;
  padding: 10px 0px;
  font-size: 40px;
  background: #91DCFF;
  color: #FFF;
  box-sizing: border-box;
  text-shadow: 0 1px 1px #3CC0FF;
  margin: 0 0 20px;
}

h2.sample_h2:before,h2.sample_h2:after{
  position: absolute;
  content: '';
  width: 0px;
  height: 0px;
  z-index: 1;
}

h2.sample_h2:before{
  top: 0;
  left: 0;
  border-width: 30px 0px 30px 15px;
  border-color: transparent transparent transparent #fff;
  border-style: solid;
}

h2.sample_h2:after{
top: 0;
right: 0;
  border-width: 30px 15px 30px 0px;
  border-color: transparent #fff transparent transparent;
  border-style: solid;
}


ul.sample_item_wrap{
    width: 100%;
    padding: 0 0 20px;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
    white-space: nowrap;
    scroll-snap-type: x mandatory;
    margin: 0 0 0;
}

li.sample_item{
    scroll-snap-align: start;
    margin: 0 12px 0 0px;
    display: inline-block;
    width: 360px;
    white-space: normal;
    vertical-align: top;
    background: #ECF0F4;
    border-radius: 10px;
	text-align: center;
	padding: 0 0 105px;
	position: relative;
}

h3.sample_item_h3{
padding: 20px;
background: var(--blue002);
color: #fff;
border-radius: 10px 10px 0 0;
text-align: left;
white-space: nowrap;
font-size: 28px;
}

img.sample_item_image{
width: 100%;
margin: 0 0 10px;
}

.sample_item_label-workform{
font-size: 20px;
display: inline-block;
padding: 10px 20px;
border-radius: 100px;
background: #fe9c3c;
color: #fff;
font-weight: bold;
line-height: 1;
margin: 0 0 10px;
}

ul.sample_item_spec{
width: calc(100% - 40px);
margin: 0 auto;
}

ul.sample_item_spec li{
border-bottom: dotted 3px #ccc;
padding: 5px 0px;
}

ul.sample_item_spec li.sample_item_spec_salary{
font-size: 28px;
font-weight: bold;
}

ul.sample_item_spec li.sample_item_spec_salary span.color01{
font-size: 140%;
color: #ff4b4b;
}

a.sample_item_linkbutton{
position: absolute;
display: block;
background: #FF5800;
box-shadow: 0 5px 0 #B62400;
line-height: 1;
padding: 20px;
text-decoration: none;
color: #fff;
font-weight: bold;
border-radius: 10px;
bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
	white-space: nowrap
}

p.sample_addition{
font-size: 20px;
}

section.sample.sample_highclass h3.sample_item_h3{
background: #1d3e72;
text-align: center;
}

section.sample.sample_highclass .sample_item_label-workform{
background: #3F3F3F;
}

section.sample.sample_highclass a.sample_item_linkbutton{
background: #a91727;
box-shadow: 0 5px 0 #600D16;
border-radius: 100px;
padding: 20px 30px;
}

/*pickup
----------------------------------------------------------------------*/

section.pickup{
padding: 0px 20px;
margin: 0 0 60px;
}


h2.pickup_h2,h2.compare_h2,h2.merit_h2,h2.qanda_h2{
display: block;
width: 580px;
position: relative;
height: 60px;
line-height: 1;
text-align: center;
padding: 10px 0px;
font-size: 36px;
background: var(--blue002);
color: #FFF;
box-sizing: border-box;
text-shadow: 0 1px 1px var(--blue001);
margin: 0 auto 20px;
}

h2.pickup_h2:before,h2.pickup_h2:after,h2.compare_h2:before,h2.compare_h2:after,h2.merit_h2:before,h2.merit_h2:after,h2.qanda_h2:before,h2.qanda_h2:after{
position: absolute;
    content: '';
    width: 0px;
    height: 0px;
    z-index: 1;
}

h2.pickup_h2:before,h2.compare_h2:before,h2.merit_h2:before,h2.qanda_h2:before{
    top: 0;
    left: 0;
    border-width: 30px 0px 30px 15px;
    border-color: transparent transparent transparent #f5f5f5;
    border-style: solid;
}

h2.pickup_h2:after,h2.compare_h2:after,h2.merit_h2:after,h2.qanda_h2:after{
    top: 0;
    right: 0;
    border-width: 30px 15px 30px 0px;
    border-color: transparent #f5f5f5 transparent transparent;
    border-style: solid;
}

.pickup_item{
display: flex;
background: #fff;
padding: 20px;
border-radius: 10px;
box-shadow: 0px 2px 4px rgb(0 0 0 / 30%);
}

.pickup_item:not(:last-child){
margin: 0 0 30px;
}

a.pickup_item_banner_wrap{
margin: 0 20px 0 0;
}

a.pickup_item_servicename{
display: inline-block;
color: var(--blue001);
font-weight: bold;
font-size: 36px;
margin: 0 0 10px;
line-height: 1.35;
}

.pickup_item_value{
display: flex;
align-items: center;
line-height: 1;
margin: 0 0 10px;
}

.pickup_item_value .__label{
background: var(--blue001);
color: #fff;
line-height: 1;
padding: 5px 5px 7px;
font-size: 24px;
margin: 0 10px 0 0;
}

.pickup_item_value span.__score{
font-family: 'Anton', sans-serif, cursive;
color: #ff4d66;
}

p.pickup_item_description{
font-size: 24px;
margin: 0 0 10px;
}

a.pickup_item_linkbutton{
display: block;
text-decoration: none;
font-size: 24px;
border-radius: 100px;
text-align: center;
color: #fff;
font-weight: bold;
background: #ff3300;
box-shadow: 0 6px 0 #B62400;
padding: 10px 0;
}

h3.pickup_area_h3{
background: var(--pink002);
display: inline-block;
line-height: 1;
padding: 20px 20px 22px;
margin: 0 0 15px;
font-size: 32px;
color: #fff;
position: relative;
border-radius: 10px;
}

h3.pickup_area_h3:after{
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    border-style: solid;
    border-color: var(--pink002) transparent transparent transparent;
    border-width: 15px 10px 0 10px;
    z-index: 1;
}

span.__white{
background: #fff;
color: #3F3F3F;
line-height: 1;
padding: 0 5px 2px;
margin: 0 10px 0 10px;
font-size: 28px;
}

.pickup_item_spec_wrap{
display: flex;
margin: 0 0 10px;
white-space: nowrap;
}

.pickup_item_spec{
display: flex;
font-size: 20px;
align-items: center;
position: relative;

}

.pickup_item_spec_wrap .pickup_item_spec:first-child{
margin: 0 20px 0 0;
}

.pickup_item_spec_wrap .pickup_item_spec:first-child:after{
position: absolute;
content: '/';
right: -15px;
color: #ccc;
font-size: 24px;
}

.pickup_item_spec .__label{
font-size: 20px;
line-height: 1;
padding: 5px 5px 5px;
border: solid 2px var(--blue002);
background: var(--blue004);
color: var(--blue002);
border-radius: 6px;
font-weight: bold;
}

.pickup_item_spec .__contents{
line-height: 1;
}

.pickup_h2_baloon{
display: inline-block;
line-height: 1;
padding: 15px 15px 17px;
background: #333;
color: #fff;
font-weight: bold;
border-radius: 10px;
position: relative;
margin: 0 0 15px;
}

.pickup_h2_baloon:after{
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    border-style: solid;
    border-color: #333 transparent transparent transparent;
    border-width: 15px 10px 0 10px;
    z-index: 1;
}

/*reason
----------------------------------------------------------------------*/

section.reason{
padding: 0 20px;
margin: 0 0 60px;
}

img.reason_image{
width: 100%;
}


/*ranking
----------------------------------------------------------------------*/

section.ranking{
margin: 0 0 60px;
padding: 0 0;
}


h2.ranking_h2{
position: relative;
background: linear-gradient(to left ,var(--blue001) 0%, var(--blue002) 50% , var(--blue001) 100%);
color: #fff;
line-height: 1.4;
padding: 20px 0;
text-align: center;
margin: 0 0 20px;
font-size: 40px;
text-shadow: 0 -2px 1px var(--blue001)
}

h2.ranking_h2 span.__small{
font-size: 28px;
}

h2.ranking_h2:before,h2.ranking_h2:after{
position: absolute;
display: inline-block;
content: '';
background-size: contain;
width: 42px;
height: 96px;
}

h2.ranking_h2:before{
background: url(../images/aga_ranking_h2_icon01.png);
left: 10px;
bottom: 20px;
}

h2.ranking_h2:after{
background: url(../images/aga_ranking_h2_icon02.png);
right: 10px;
bottom: 20px;
}

.ranking_inner{
padding: 0 20px;
}

.ranking_item{
padding: 20px;
border-radius: 10px;
background: #fff;
margin: 0 0 30px;
box-shadow: 0px 2px 4px rgb(0 0 0 / 30%);
}

.ranking_item_header{
position: relative;
padding: 0 0 30px 82px;
border-bottom: solid 2px #ccc;
margin: 0 0 20px;
}

.ranking_item_header_rank{
position: absolute;
height: 84px;
width: 72px;
background-image: url(../images/aga_ranking-item_rank-icon04.png);
background-repeat: no-repeat;
background-size: cover;
text-align: center;
font-weight: bold;
font-size: 40px;
left: 0;
top: 0;
}

.ranking_item_header_rank.rank01{
background-image: url(../images/aga_ranking-item_rank-icon01.png);
}

.ranking_item_header_rank.rank02{
background-image: url(../images/aga_ranking-item_rank-icon02.png);
}

.ranking_item_header_rank.rank03{
background-image: url(../images/aga_ranking-item_rank-icon03.png);
}

.ranking_item_header_rank.rank04,.ranking_item_header_rank.rank05{
background-image: url(../images/aga_ranking-item_rank-icon04.png);
}


h3.ranking_item_header_h3{
font-size: 40px;
line-height: 1.4;
width: 100%;
margin: 0 0 20px;
}

.ranking_item_header_star{
font-size: 28px;
width: 182px;
white-space: nowrap;
line-height: 1;
}


.ranking_item_header_star span.__pt{
font-size: 20px;
padding: 6px 10px 6px;
margin: 0 8px 0 0;
background: var(--blue000);
color: #fff;
border-radius: 6px;
line-height: 1;
vertical-align: 4px;
}

 .ranking_item_header_star span.__score{
 font-family: 'Anton', sans-serif, cursive;
color: #ff4d66;
font-weight: normal;
font-size: 36px;
 }
 
.ranking_item_maincopy{
font-size: 32px;
font-weight: bold;
margin: 0 0 20px;
}

.ranking_item_maincopy span.__red{
color: #FF3714;
}

.ranking_item_spec01{
display: flex;
align-items: flex-start;
margin: 0 0 20px;
}

a.ranking_item_banner_wrap{
margin: 0 20px 0 0;
}

img.ranking_item_banner{
width: 300px;
}

table.ranking_item_spec01_table,table.ranking_item_spec02_table{
width: 100%;
border-collapse: collapse;
text-align: center;
font-size: 24px;
}

table.ranking_item_spec01_table th,table.ranking_item_spec01_table td,table.ranking_item_spec02_table th,table.ranking_item_spec02_table td{
border: solid 1px var(--blue003);
font-weight: bold;
}

table.ranking_item_spec01_table th,table.ranking_item_spec02_table th{
background: var(--blue003);
line-height: 1;
padding: 10px 0;
}

table.ranking_item_spec01_table td,table.ranking_item_spec02_table td{
padding: 15px 0;
}

td.ranking_item_spec01_table_ocupation{
display: flex;
justify-content: center;
}

.ranking_item_spec01_tdinner{
display: inline-block;
text-align: left;
}

td .ranking_item_spec01_tdinner:first-child{
margin: 0 20px 0 0;
}

.ranking_item_spec01_table span.__label_kangoshi:before,.ranking_item_spec01_table span.__label_junkangoshi:before,.ranking_item_spec01_table span.__label_zyosanshi:before,.ranking_item_spec01_table span.__label_hokenshi:before{
content: '';
display: inline-block;
background-image: url(../images/kango_ranking_item_spec01__lable_icon01.png);
background-size: cover;
width: 32px;
height: 24px;
margin: 0 5px 0 0;
    top: 50%;
    transform: translateY(3px);
}
.ranking_item_spec01_table span.__label_junkangoshi:before{
background-image: url(../images/kango_ranking_item_spec01__lable_icon02.png);
}

.ranking_item_spec01_table span.__label_zyosanshi:before{
background-image: url(../images/kango_ranking_item_spec01__lable_icon03.png);
}

.ranking_item_spec01_table span.__label_hokenshi:before{
background-image: url(../images/kango_ranking_item_spec01__lable_icon04.png);
}

table.ranking_item_spec02_table{
margin: 0 0 20px;
}

table.ranking_item_spec02_table th{
width: calc(100% / 3);
}

table.ranking_item_spec02_table span.__small{
font-size: 20px;
}

table.ranking_item_spec02_table td{
padding: 20px;
}

table.ranking_item_spec02_table.__welfare td{
text-align: left;
} 

ul.ranking_item_spec02_tags{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

ul.ranking_item_spec02_tags li{
flex-basis: calc((100% - 30px) / 4 );
background: var(--blue002);
color: #fff;
font-weight: bold;
border-radius: 100px;
margin: 0 0 10px;
line-height: 1;
padding: 8px 10px 10px;
}

ul.ranking_item_table_ocupationlist{
display: flex;
flex-wrap: wrap;
align-items: baseline;
}

ul.ranking_item_table_ocupationlist li{
background: var(--blue002);
color: #fff;
font-size: 28px;
line-height: 1;
padding: 8px 20px;
margin: 0 8px 8px 0;
border-radius: 100px;
}

ul.ranking_item_table_ocupationlist li:last-child{
background: none;
color: #666;
padding: 8px 0;
font-size: 24px;
margin: 0;
}


.ranking_item_point_box{
padding: 60px 20px 20px;
position: relative;
margin: 0 0 20px;
border: solid 1px var(--pink002);
}

.ranking_item_point_h4_wrap{
position: absolute;
top: 0;
left: 0;
}

h4.ranking_item_point_h4{
background: var(--pink002);
    line-height: 1;
    display: inline-block;
    position: relative;
    color: #fff;
    padding: 10px 0px 12px 15px;
    height: 50px;
    font-size: 28px;
}

h4.ranking_item_point_h4:after{
    content: '';
    position: absolute;
    top: 0;
    right: -32px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 50px 32px 0 0;
    border-color: var(--pink002) transparent transparent transparent;
}

ul.ranking_item_point_list{
font-weight: bold;
padding: 20px 20px 20px 52px;
margin: 0 0 20px;
border: solid 1px var(--blue002);
}

ul.ranking_item_point_list li{
position: relative;
margin: 0 0 10px;
}

ul.ranking_item_point_list li:after{
position: absolute;
content: '\f058';
    font-family: "Font Awesome 5 Free";
	font-weight: 900;
	left: -40px;
	top: 3px;
	color: var(--red002);
}

p.ranking_item_point_description{
    background-color: #fff;
    background-image: linear-gradient(180deg, #f5f5f5 1px, transparent 1px);
    background-size: 100% 2em;
    line-height: 2.0em;
    padding-bottom: 4px;
	font-size: 24px;
}

p.ranking_item_point_description span.__red{
color: var(--red001);
font-weight: bold;
}

.ranking_item_microcopy{
display: inline-block;
font-weight: bold;
position: relative;
line-height: 1;
margin: 0 0 10px;
}

.ranking_item_microcopy:after,.ranking_item_microcopy:before{
position: absolute;
content: '';
background-image: url(../images/aga_ranking_microcopy_right.png);
width: 16px;
height: 32px;
right: -30px;
bottom: 0;
}

.ranking_item_microcopy:before{
background-image: url(../images/aga_ranking_microcopy_left.png);
left: -30px;
right: auto;
bottom: 0;
}

.center{
text-align: center;
}

a.ranking_item_linkbutton{
    width: 100%;
    text-align: center;
    font-size: 32px;
    display: block;
    text-decoration: none;
    color: #fff;
    background: #FF5800;
    font-weight: bold;
    box-shadow: 0 8px 0 #B62400;
    border-radius: 10px;
    padding: 20px 0;
    position: relative;
    overflow: hidden;
    margin: 0 auto 8px;
}

p.ranking_item_addition{
margin: 28px 0 0 ;
font-size: 22px;
}

p.ranking_item_baloon{
background: #fff6ed;
border: solid 1px #fd9426;
width: calc(100% - 40px);
margin: 0 auto 20px;
font-size: 24px;
line-height: 1.7;
padding: 20px;
position: relative;
border-radius: 10px;
}

p.ranking_item_baloon:before{
  content: "";
  position: absolute;
  top: 100%;
      left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  border: 8px solid transparent;
  border-top: 14px solid #fff6ed;
  z-index: 2;
}

p.ranking_item_baloon:after{
  content: "";
  position: absolute;
  top:100%;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  border: 10px solid transparent;
  border-top: 16px solid #fd9426;
  z-index: 1;
}

p.ranking_item_baloon span.__red{
color: #FF3714;
font-weight: bold;
}

.ranking_item_sample_box{
padding: 60px 20px 20px;
position: relative;
margin: 0 0 30px;
border: solid 1px var(--blue002);
}

.ranking_item_sample_h4_wrap{
position: absolute;
top: 0;
left: 0;
}

h4.ranking_item_sample_h4{
background: var(--blue002);
    line-height: 1;
    display: inline-block;
    position: relative;
    color: #fff;
    padding: 10px 0px 12px 15px;
    height: 50px;
    font-size: 28px;
}

h4.ranking_item_sample_h4:after{
    content: '';
    position: absolute;
    top: 0;
    right: -32px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 50px 32px 0 0;
    border-color: var(--blue002) transparent transparent transparent;
}

img.ranking_item_sample_image{
width: 100%;
}


h4.ranking_item_uservoice_h4{
background: var(--blue002);
color: #fff;
display: inline-block;
line-height: 1;
padding: 15px 15px;
position: relative;
border-radius: 0 20px 0 0;
border: solid 1px var(--blue002);
}

h4.ranking_item_uservoice_h4:before{
margin: 0 10px 0 0;
    content: '\f4ad';
    font-family: "Font Awesome 5 Free";
	font-weight: 400;
}

h4.ranking_item_uservoice_h4 span.__notice{
font-size: 20px;
font-weight: normal;
}

li.ranking_item_review{
position: relative;
}

ul.ranking_item_review__wrap li.ranking_item_review:not(:last-child){
margin: 0 0 20px;
padding: 0 0 20px;
}

ul.ranking_item_review__wrap li.ranking_item_review:not(:last-child):after{
position: absolute;
display: block;
content: '';
background: #ccc;
height: 2px;
width: calc(100%);
bottom: 0;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
 }

.ranking_item_review__profile{
padding: 0 0 0 84px;
position: relative;
font-size: 24px;
}

.ranking_item_review__profile:before{
position: absolute;
content: '';
display: inline-block;
width: 64px;
height: 64px;
background: url(../images/20s_ranking_item_review-icon.png);
left: 0;
background-repeat: no-repeat;
}

.ranking_item_review__profile.male:before{
position: absolute;
content: '';
display: inline-block;
width: 64px;
height: 64px;
background: url(../images/20s_ranking_item_review-icon_male.png);
left: 0;
background-repeat: no-repeat;
}

.ranking_item_review__profile_title{
line-height: 1.25;
font-weight: bold;
color: var(--blue002);
padding: 20px 0 20px;
}

.ranking_item_review__profile_detail{
display: flex;
align-items: center;
}

._detail_star{
margin: 0 20px 0 0;
}

span._detail_star_gold{
color: #ffcc00;
}

span._detail_star_gray{
color: #ccc;
}

._detail_age-occuaption{
font-size: 20px;
}

p.ranking_item_review__description{
font-size: 20px;
}

.ranking_item_review__box{
position: relative;
margin: 0 0 20px;
border: solid 1px var(--blue002);
}

.grad-btn {
  z-index: 2;
    position: absolute;
    right: 0;
    bottom: 20px;
    left: 0;
    width: 148px;
    margin: auto;
    padding: 5px 0;
    border-radius: 4px;
    background: #fe9c3c;
    color: #fff;
    font-size: 1.3rem;
    text-align: center;
    cursor: pointer;
    transition: .2s ease;
    box-shadow: 0 0 3px rgb(0 0 0 / 30%);
	font-weight: bold;
}

ul.ranking_item_review__wrap{
padding: 20px;
background: #fff;
  position: relative;
  overflow: hidden;
  height: 280px;
}

ul.ranking_item_review__wrap::before {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100px; /*グラデーションで隠す高さ*/
  background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0.9) 50%, #fff 100%);
  background: linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0.9) 50%, #fff 100%);
  content: "";
  z-index: 1;
}
.grad-trigger {
  display: none; /*チェックボックスは常に非表示*/
}
.grad-trigger:checked + .grad-btn {
  display: none; /*チェックされていたら、grad-btnを非表示にする*/
}
.grad-trigger:checked ~ ul.ranking_item_review__wrap{
  height: auto; /*チェックされていたら、高さを戻す*/
}
.grad-trigger:checked ~ ul.ranking_item_review__wrap::before {
  display: none; /*チェックされていたら、grad-itemのbeforeを非表示にする*/
}

h4.ranking_item_comment_h4{
background: var(--blue002);
color: #fff;
display: inline-block;
line-height: 1;
padding: 15px 15px;
position: relative;
border-radius: 0 20px 0 0;
}

.ranking_item_comment{
margin: 0 0 20px;
}

h4.ranking_item_comment_h4:before{
margin: 0 10px 0 0;
    content: '\f044';
    font-family: "Font Awesome 5 Free";
	font-weight: 400;

}

p.ranking_item_comment_description{
background: #FFF9ED;
padding: 0px;
font-size: 24px;
}

p.ranking_item_comment_description span.__color01{
color: var(--red001);
font-weight: bold;
}

.ranking_item_user_list_h4{
font-size: 32px;
margin: 0 0 6px;
}

.ranking_item_user_list_h4:before{
margin: 0 0 0 0;
content: '';
display: inline-block;
width: 60px;
height: 60px;
background: url(../images/20s_ranking_item_user_list_h4icon.png);
background-repeat: no-repeat;
background-size: contain;
vertical-align: -5px;
}

ul.ranking_item_user_list{
padding: 20px;
border: solid 2px #ccc;
margin: 0 0 20px;
box-shadow: 0px 2px 4px rgb(0 0 0 / 15%);
border-radius: 6px;
}

ul.ranking_item_user_list li{
font-weight: bold;
padding: 6px 0 6px 36px;
position: relative;

}

ul.ranking_item_user_list li:not(:last-child){
border-bottom: solid 2px #ccc;
}

ul.ranking_item_user_list li:before{
position: absolute;
content: '\f058';
    font-family: "Font Awesome 5 Free";
    font-weight: 700;
    color: #F8B62D;
    left: 0;
}

.ranking_item_comment_inner{
padding: 20px;
background: #FFF9ED;
}

h5.ranking_item_comment_h5{
font-size: 28px;
position: relative;
padding: 0 0 0 56px;
margin: 0 0 10px;
}

h5.ranking_item_comment_h5:before{
position: absolute;
display: inline-block;
content: '';
width: 46px;
height: 46px;
background: url(../images/20s_ranking_item_user_descripttion_h5icon.png);
background-size: contain;
background-repeat: no-repeat;
left: 0;
}

.ranking_item_comment_inner p.ranking_item_comment_description:not(:last-child){
margin: 0 0 20px;
}

p.ranking_item_notice{
margin: 15px 0 0;
color: #666;
font-size: 20px;
}

p.ranking_item_pr{
line-height: 1;
font-size: 24px;
margin: 0 0 20px;
}

.ranking_h2_02_wrap{
position: relative;
z-index: 0;
background: var(--blue001);
text-align: center;
overflow: hidden;
padding: 70px 0 40px;
margin: 0 0 20px;
border-radius: 8px;
}

.ranking_h2_02_wrap:before{
  content: '';
  position: absolute;
  left:40%;
  top: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  background: linear-gradient(to left, #0096ff 0%, #0a6691 100%);
  transform: skewX(30deg);
  transform-origin: top right;
  z-index: -1;
}

.ranking_h2_02_wrap:after{
content: '';
position: absolute;
width: 100%;
height: 24px;
background: #3F3F3F;
top: 0;
left: 0;
border-bottom: solid 4px #fff;
}


h2.ranking_h2_02{
color: #fff;
font-size: 48px;
text-shadow: 0px 4px 0px rgb(0 0 0 / 20%);
}

.ranking_h2_02_subtitle{
color: #fff;
font-size: 32px;
text-shadow: 0px 4px 0px rgb(0 0 0 / 20%);
}

.ranking_h2_02_subtitle span.__underline{
border-bottom: solid 4px #fff;
font-weight: bold;
}

.ranking_h2_02_date{
position: absolute;
content: '';
width: 80px;
height: 120px;
background-image: url(../images/20s_ranking_h2_02_date_icon01.png);
background-size: contain;
top: 0;
left: 20px;
z-index: 100;
color: #fff;
font-size: 20px;
line-height: 1.2;
padding: 36px 0 0;
}

.ranking_h2_02_date span.__month{
font-weight: bold;
}

.ranking_inner.ranking_inner_engineer{
padding: 0 0px;
}

.ranking_tab_wrap {
  display: flex;
  flex-wrap: wrap;
  margin:20px 0 0;
}

.tab_ranking_label {
  color: White;
  background: #aaa;
  font-weight: bold;
  text-shadow: 0 -1px 0 rgba(0,0,0,.2);
  white-space: nowrap;
  text-align: center;
  padding: 10px .5em;
  order: -1;
  position: relative;
  z-index: 1;
  cursor: pointer;
  border-radius: 5px 5px 0 0;
  flex: 1;
}

.tab_ranking_label span.__small{
font-size: 20px;
}

.tab_ranking_label:not(:last-of-type) {
  margin-right: 5px;
}
.tab_ranking_content {
  width: 100%;
  height: 0;
  overflow: hidden;
  opacity: 0;
}
/* アクティブなタブ */
.tab_ranking_switch:checked+.tab_ranking_label {
  background: #4B96EF;
}

.tab_ranking_switch:checked+.tab_ranking_label:nth-of-type(2) {
  background: #D35A78;
}

.tab_ranking_switch:checked+.tab_ranking_label+.tab_ranking_content {
  height: auto;
  overflow: auto;
  padding: 20px;
  opacity: 1;
  transition: .5s opacity;
  background: #fff;
border-radius: 0 0 10px 10px;
border-top: solid 8px #4B96EF;
}
/* ラジオボタン非表示 */
.tab_ranking_switch {
  display: none;
}

.tab_ranking_content{

}

.tab_ranking_switch:checked+.tab_ranking_label+.tab_ranking_content.tab_ranking_2{
border-top: solid 8px #D35A78;
}

.ranking_tab_baloon{
display: inline-block;
font-weight: bold;
position: relative;
line-height: 1;
}

.ranking_tab_baloon:before,.ranking_tab_baloon:after{
position: absolute;
bottom: 0;
height: 2rem;
content: '';
}

.ranking_tab_baloon:before{
border-left: solid 4px #888;
left: -20px;
transform: rotate(-20deg);
}

.ranking_tab_baloon:after{
border-right: solid 4px #888;
right: -20px;
transform: rotate(20deg);
}

.tab_ranking_content .ranking_item{
border: solid 1px #ccc;
}

ul.__engineer_occupation_list{
position: relative;
display: flex;
flex-wrap: wrap;
font-size: 20px;
padding: 24px 16px 16px;
background: var(--blue004);
margin: 0 0 20px;
}

ul.__engineer_occupation_list li:after{
content: ' / ';
white-space: pre-wrap;
}

ul.__engineer_occupation_list li:last-child:after{
content: none;
}


table.ranking_item_spec02_table td ul.__engineer_occupation_list:last-child{
margin: 0;
}

.__engineer_occupation_label{
font-size: 24px;
position: absolute;
color: var(--blue000);
top: -16px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}


/*merit
----------------------------------------------------------------------*/

section.merit{
padding: 0 20px;
margin: 0 0 60px;
}

.merit_h2_wrap{
position: relative;
padding: 152px 0 0;
margin: 0 0 20px;
}

.merit_h2_wrap h2.merit_h2{
margin: 0 auto 0;
}

.merit_h2_wrap:before{
position: absolute;
content: '';
background-image: url(../images/aga_merit_h2_image.png);
width: 196px;
height: 152px;
top: 0px;
    left: calc(50% - 20px);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

img.merit_image_01{
width: 100%;
margin: 0 0 20px;
}

.pickup_microcopy{
display: inline-block;
font-weight: bold;
position: relative;
line-height: 1;
margin: 0 0 10px;
}

.pickup_microcopy:after,.pickup_microcopy:before{
position: absolute;
content: '';
background-image: url(../images/aga_ranking_microcopy_right.png);
width: 16px;
height: 32px;
right: -30px;
bottom: 0;
}

.pickup_microcopy:before{
background-image: url(../images/aga_ranking_microcopy_left.png);
left: -30px;
right: auto;
bottom: 0;
}

/*qanda
----------------------------------------------------------------------*/

section.qanda{
padding: 0 20px;
margin: 0 0 60px;
}

#question .accordion-area{
    list-style: none;
	margin:0 auto;
}

#question .accordion-area li{
    margin: 10px 0;
}

#question .accordion-area li:last-child{
margin: 0;
}

#question .accordion-area section {
  border: 1px solid #ccc;
  background: #fff;
  border-radius: 10px;
}

/*アコーディオンタイトル*/
#question .title {
    position: relative;/*+マークの位置基準とするためrelative指定*/
    cursor: pointer;
    font-size:24px;
    font-weight: normal;
    padding: 3% 3% 3% 50px;
    transition: all .5s ease;
	background: #fff;
	font-weight: bold;
	border-radius: 10px;
}

/*アイコンの＋と×*/
#question .title::before,
#question .title::after{
    position: absolute;
    content:'';
    width: 15px;
    height: 2px;
    background-color: #333;
    
}
#question .title::before{
    top:48%;
    left: 15px;
    transform: rotate(0deg);
    
}
#question .title::after{    
    top:48%;
    left: 15px;
    transform: rotate(90deg);

}
/*　closeというクラスがついたら形状変化　*/
#question .title.close::before{
  transform: rotate(45deg);
}

#question .title.close::after{
  transform: rotate(-45deg);
}

/*アコーディオンで現れるエリア*/
#question .box {
    display: none;/*はじめは非表示*/
    background: #f3f3f3;
  margin:0 3% 3% 3%;
    padding: 3%;
}

#question .box p{
font-size: 20px;
}




/*result
----------------------------------------------------------------------*/
section.result{
padding: 20px 20px 0;
margin: 0 0 60px;
}

.result_header01{
background: #fff;
border-radius: 10px;
display: flex;
justify-content: space-between;
align-items: center;
margin: 0 0 15px;
}

.result_header01_counter{
font-size: 24px;
}

span.result_header01_counter_color{
color: #ff4b4b;
font-weight: bold;
}

a.result_header01_change-button_wrap{
text-decoration: none;
}

.result_header01_change-button{
color: #888;
font-weight: bold;
font-size: 24px;
padding: 15px 10px;
background: #f4f4f4;
border-radius: 6px;
line-height: 1;
border: solid 2px #ccc;
}

.result_header01_change-button i{
margin: 0 10px 0 0 ;
}

.result_header02{
padding: 20px;
background: #fff;
margin: 0 0 15px;
border-radius: 10px;
position: relative;
}

h3.result_header02_h3{
font-weight: normal;
color: #3F3F3F;
margin: 0 0 10px;
font-size: 28px;
}

h3.result_header02_h3 i{
margin: 0 5px 0 0;

}

.result_header02_wrap{
}

ul.result_header02_settings_wrap{
padding: 0;
display: flex;
flex-wrap: wrap;
}

ul.result_header02_settings_wrap li{
padding: 5px 10px 5px 20px;
border: solid 2px var(--blue001);
color: var(--blue001);
font-weight: 600;
margin: 0 10px 10px 0;
position: relative;
font-size: 24px;
}

ul.result_header02_settings_wrap li:after{
position: absolute;
    content: '\f0da';
    font-family: "Font Awesome 5 Free";
	font-weight: 900;
	left: 5px;
	color: var(--blue001);
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

.result_header02_pr{
position: absolute;
font-size: 24px;
background: #888;
line-height: 1;
color: #fff;
padding: 8px 12px;
border-radius: 8px;
top: 20px;
right: 20px;
}


section.notice_result{
text-align: center;
padding: 20px;
margin: 0 0 20px;
border-radius: 10px;
background: #FFF4EB;
border: solid 2px #ff7e0e;
}

h3.notice_result_title{
font-size: 20px;
}

h3.notice_result_title:before{
content: '\f058';
font-family: "Font Awesome 5 Free";
font-weight: 900;
color: #00cc99;
margin: 0 5px 0 0;
}

p.notice_result_description{
font-size: 20px;
text-align: center;
}

section.notice_result.result_none{
background: #fff;
}

section.notice_result.result_none h3.notice_result_title:before{
color: #ff4b4b;
}

#submit_select{
margin: 0 0 30px auto;
padding: 0 15px;
background: #fff;
border: 1px solid #ccc;
border-radius: 10px;
width: 320px;
height: 50px;
font-size: 20px;
line-height: 48px;
display: block;
color: #888;
}

.result_item{
background: #fff;
padding: 20px;
border-radius: 10px;
margin: 0 0 20px;
box-shadow: 0px 2px 4px rgb(0 0 0 / 30%);
margin: 0 0 30px;
}

ul.result_item_tags{
display: flex;
flex-wrap: wrap;
}

ul.result_item_tags li{
font-size: 22px;
font-weight: bold;
margin: 0 8px 8px 0;
line-height: 1;
padding: 6px 6px 8px;
background: #c90e38;
color: #fff;
border-radius: 6px;
}

ul.result_item_tags li sup{
vertical-align: top;
}

ul.result_item_tags li.__gold{
background: linear-gradient(to bottom right, #BB9A00 0% ,#E0C15E 50%, #BB9A00 100%);
text-shadow: 0 -1px 0 #A37D1E;
}

ul.result_item_tags li.__gold i{
margin: 0 5px 0 0;
font-size: 22px;
color: #EFE9CB;
}

.result_item_header{
display: flex;
margin: 0 0 20px;
}

a.result_item_name{
display: inline-block;
color: var(--blue002);
font-weight: bold;
font-size: 36px;
line-height: 1.45;
margin: 0 0 10px;

}

.result_item_spec01{
width: 100%;
}

.result_item_spec01_tdinner{
display: inline-block;
text-align: left;
}

td.result_item_spec01_table_ocupation{
display: flex;
justify-content: center;
}

td .result_item_spec01_tdinner:first-child{
margin: 0 10px 0 0;
}

.result_spec01_table span.__label_kangoshi:before,.result_spec01_table span.__label_junkangoshi:before,.result_spec01_table span.__label_zyosanshi:before,.result_spec01_table span.__label_hokenshi:before{
content: '';
display: inline-block;
background-image: url(../images/kango_ranking_item_spec01__lable_icon01.png);
background-size: cover;
width: 32px;
height: 24px;
margin: 0 5px 0 0;
    top: 50%;
    transform: translateY(3px);
}
.result_spec01_table span.__label_junkangoshi:before{
background-image: url(../images/kango_ranking_item_spec01__lable_icon02.png);
}

.result_spec01_table span.__label_zyosanshi:before{
background-image: url(../images/kango_ranking_item_spec01__lable_icon03.png);
}

.result_spec01_table span.__label_hokenshi:before{
background-image: url(../images/kango_ranking_item_spec01__lable_icon04.png);
}

a.result_item_banner_wrap{
margin: 0 20px 0 0;
}

img.result_item_banner{
width: 250px;
}

table.result_spec01_table{
width: 100%;
text-align: left;
font-size: 24px;
border-collapse: collapse;
}

table.result_spec01_table tr{
border-bottom: dotted 2px #ccc;
}

table.result_spec01_table th{
width: 130px;
padding: 15px 0px;
line-height: 1;
color: #888;

}


table.result_spec01_table span.__label_hoikushi:before,table.result_spec01_table span.__label_yochien:before{
content: '';
display: inline-block;
background-image: url(../images/ranking_item_spec01__lable_icon01.png);
background-size: cover;
width: 32px;
height: 24px;
margin: 0 5px 0 0;
    top: 50%;
    transform: translateY(3px);
}
table.result_spec01_table span.__label_yochien:before{
background-image: url(../images/ranking_item_spec01__lable_icon02.png);
}


.result_item_point_box{
padding: 60px 20px 20px;
position: relative;
margin: 0 0 20px;
border: solid 1px #9F9184;
}

.result_item_point_h4_wrap{
position: absolute;
top: 0;
left: 0;
}

h4.result_item_point_h4{
background: #9F9184;
    line-height: 1;
    display: inline-block;
    position: relative;
    color: #fff;
    padding: 10px 0px 12px 15px;
    height: 50px;
    font-size: 28px;
}

h4.result_item_point_h4:after{
    content: '';
    position: absolute;
    top: 0;
    right: -32px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 50px 32px 0 0;
    border-color: #9F9184 transparent transparent transparent;
}

ul.result_item_point_list{
font-weight: bold;
padding: 0 0 0 42px;
margin: 0 0 20px;
}

ul.result_item_point_list li{
position: relative;
margin: 0 0 10px;
}

ul.result_item_point_list li:after{
position: absolute;
content: '\f00c';
    font-family: "Font Awesome 5 Free";
	font-weight: 900;
	left: -40px;
	top: 3px;
	color: var(--red002);
}

p.result_item_point_description{
    background-color: #fff;
    background-image: linear-gradient(180deg, #f5f5f5 1px, transparent 1px);
    background-size: 100% 2em;
    line-height: 2.0em;
    padding-bottom: 4px;
	font-size: 24px;
}

.result_item_microcopy{
    display: inline-block;
    font-weight: bold;
    position: relative;
    line-height: 1;
    margin: 0 0 10px;
}

.result_item_microcopy:before,.result_item_microcopy:after{
    position: absolute;
    content: '';
    background-image: url(../images/aga_ranking_microcopy_right.png);
    width: 16px;
    height: 32px;
    right: -30px;
    bottom: 0;
}

.result_item_microcopy:before{
    background-image: url(../images/aga_ranking_microcopy_left.png);
    left: -30px;
    right: auto;
    bottom: 0;
}

.result_item_microcopy:after{

}

a.result_item_linkbutton{
    width: 100%;
    text-align: center;
    font-size: 32px;
    display: block;
    text-decoration: none;
    color: #fff;
    background: #ff3300;
    font-weight: bold;
    box-shadow: 0 8px 0 #B62400;
    border-radius: 10px;
    padding: 20px 0;
    position: relative;
    overflow: hidden;
    margin: 0 auto 8px;
}

p.result_addition{
font-size: 24px;
margin: 0 0 60px;

}

.result_item_comment{
margin: 0 0 20px;
}

h4.result_item_comment_h4{
background: var(--blue002);
color: #fff;
display: inline-block;
line-height: 1;
padding: 15px 15px;
position: relative;
border-radius: 0 20px 0 0;
}

h4.result_item_comment_h4:before{
margin: 0 10px 0 0;
    content: '\f044';
    font-family: "Font Awesome 5 Free";
	font-weight: 400;

}

p.result_item_comment_text{
background: var(--blue004);
padding: 20px;
font-weight: bold;
font-size: 24px;
}

p.result_item_comment_text span.__color01{
color: var(--red001);
}

table.result_item_spec02_table{
width: 100%;
border-collapse: collapse;
text-align: center;
font-size: 24px;
margin: 0 0 20px;
}

table.result_item_spec02_table th,table.result_item_spec02_table td{
border: solid 1px var(--blue003);
font-weight: bold;
}

table.result_item_spec02_table th{
background: var(--blue003);
}

table.result_item_spec02_table td{
padding: 20px;
}

ul.result_item_spec02_tags{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

ul.result_item_spec02_tags li{
flex-basis: calc((100% - 30px) / 4 );
background: var(--blue002);
color: #fff;
font-weight: normal;
border-radius: 100px;
margin: 0 0 10px;
line-height: 1;
padding: 8px 10px 10px;
}

ul.result_item_spec02_tags li.__strong{
font-weight: bold;
color: #ffff66;
}

/*menu
----------------------------------------------------------------------*/

section.menu{
padding: 0 20px;
margin: 0 0 60px;
}

h2.menu_h2{
    font-size: 40px;
    position: relative;
    display: inline-block;
    padding: 0 0 0px;
    margin: 0 0 30px;
}

h2.menu_h2:after{
    content: '';
    position: absolute;
    left: 50%;
    bottom: -12px;
    display: inline-block;
    width: 80px;
    height: 10px;
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translate(-50%);
    background-color: var(--blue002);
}

.menu_area_wrap{
    background: #fff;
    border-radius: 10px;
    padding: 30px;
    margin: 0 0 60px;
}

.menu_area_row{
margin: 0 0 15px;
display: flex;
}

.menu_area_rural{
    width: 20%;
    font-size: 28px;
}

ul.menu_area_prefecture{
    display: flex;
    flex-wrap: wrap;
    width: 80%;
}

ul.menu_area_prefecture li{
    width: 23%;
    margin: 0 5px 10px;
}

ul.menu_area_prefecture li a{
    text-decoration: none;
    color: #222222;
    display: inline-block;
    width: 100%;
    text-align: center;
    padding: 8px 0px;
    border-radius: 5px;
    background: #fbe7e9;
    font-size: 24px;
    box-shadow: 0px 2px 2px #ccc;
}

.menu_category_wrap{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

a.menu_category_item{
flex-basis: calc(50% - 10px);
display: block;
background: #fff;
padding: 20px;
border-left: solid 4px var(--blue002);
text-decoration: none;
color: #222;
font-weight: bold;
margin: 0 0 20px;
position: relative;
font-size: 24px;
}

a.menu_category_item span.__color01{
font-size: 28px;
color: var(--blue002);
}

a.menu_category_item:after{
position: absolute;
    content: '\f105';
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color: var(--blue002);
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

a.menu_category_item.__agent{
border-left: solid 4px #fe9a37;
}

a.menu_category_item.__agent span.__color01{
font-size: 28px;
color: #fe9a37;
}

a.menu_category_item.__agent:after{
color: #fe9a37;
}

/*検索ボックス
----------------------------------------------------------------------*/

#search h2 span.color{
color: var(--pink003);
}

#search{
margin:0px auto 0px;
position: absolute;
z-index: 2;
}

#search .inner{
border: solid 1px #003F3F3F4;
background-color: #f5f5f5;

}

#search h2{
background-color: #fff;
text-align: center;
border-radius: 20px 20px 0px 0px;
color: #666;
padding: 20px 0px;
font-size: 20px;

}

#search h2 i{
margin: 0 10px 0 0;

}

#search .form-wrap{

}

#search .form-wrap form{
background: #fff;
padding: 30px;
box-shadow: 0px 2px 4px rgba(0,0,0,0.3);
border-radius: 0px 0px 20px 20px;
width: 680px;
}

#search select{
width: 100%;
padding: 20px 20px 20px 150px;
border-radius: 40px;
font-size: 15px;
font-weight: bold;
box-shadow: 0px 2px 4px rgba(0,0,0,0.3);
}

#search .select-wrap{
position: relative;
margin: 0 0 20px;
}

#search .select-wrap:nth-child(odd){
margin: 0 15px 20px 0;
}

#search .select-wrap:nth-child(even){
margin: 0 0 20px 15px;
}

#search .select-wrap:before{
position: absolute;
content: 'デフォルト';
display: inline-block;
    top: 50%;
    left: 30px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

#search .select-wrap.qs1:before{
content:'ご年齢';
}

#search .select-wrap.qs2:before{
content:'ご職業';
}

#search .select-wrap.qs3:before{
content:'現在の就業状況';
}

#search .select-wrap.qs4:before{
content:'現在のご年収';
}


#search table{
width: 100%;
}

#search input[type="submit"]{
    width: 50%;
    height: 60px;
    margin: 20px auto 0px;
    padding: 0 20px;
    display: block;
    border: none;
    border-radius: 40px;
    font-size: 20px;
    background:   #ff4b4b;
    color: #fff;
    font-weight: bold;
    cursor: pointer;
	box-shadow: 0px 4px 0px #992d2d;

}


#search .inner label{
display: block;
width: 100%;
background-color: #003F3F3F4;
text-align: center;
color: #fff;
font-weight: normal;
padding: 10px;
font-size: 18px;
    cursor :pointer;
    transition: all 0.5s;
position: relative;
}


.acd-check{
    display: none;
}
.acd-label{
    color: #999;
    display: block;
    margin: 0px auto 1px;
    position: relative;
	width: 200px;
	text-align: center;

}
.acd-label:before{
    box-sizing: border-box;
    content: '\f055';
    font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 20px;
	color: #ff6633;
	margin-right: 10px;
	vertical-align: -2px;
}
.acd-content{
    display: block;
    height: 0;
    opacity: 0;
    padding: 0 10px;
    transition: .5s;
    visibility: hidden;
}
.acd-check:checked + .acd-label:before{
    content: '\f056';
	color: #999;
}
.acd-check:checked + .acd-label + .acd-content{
    height: 230px;
    opacity: 1;
    padding: 10px;
    visibility: visible;
}

.acd-content table{
border-collapse: collapse;

}

.acd-content table td{
border: solid 2px #ccc;
width: 50%;
font-size: 20px;
padding: 20px;
background: #f5f5f5;
}


/*about
---------------------------------------------------------------------------*/

section.about{
width: 100%;
padding: 40px 0 0;
}

h2.about_h2{
font-size: 32px;
padding: 10px 0;
margin: 0 0 40px;
background: #e1e1e1;
border-radius: 10px 10px 0 0;

}

h2.about_h2:after,h2.about_h2:before{
content:'－';
margin: 0 10px 0 10px;
color: #999;
}


table.about_table{
width: 100%;
border-collapse: collapse;
text-align: left;
margin: 0 auto 60px;
font-size: 24px;
}

table.about_table tr{
border-bottom: dotted 2px #ccc;
}

table.about_table tr:first-child{
border-top: dotted 2px #ccc;
}

table.about_table th,table.about_table td{
padding: 15px 0px;
}

h4.about_h4{
font-size: 28px;
border-left: solid 6px #888;
padding: 0 0 0 6px;
line-height: 1.25;
margin: 0 0 15px;
}

p.about_p{
margin: 0 0 30px;
}

p.about_p:last-child{
margin: 0 0 60px;
}

/*survey
---------------------------------------------------------------------------*/

section.survey{
width: 100%;
padding: 40px 0 0;
}

h2.survey_h2{
font-size: 32px;
padding: 10px 0;
margin: 0 0 40px;
background: #e1e1e1;
border-radius: 10px 10px 0 0;
}

h2.survey_h2:after,h2.survey_h2:before{
content:'－';
margin: 0 10px 0 10px;
color: #999;
}

h3.survey_h3{
font-size: 28px;
border-left: solid 6px #ccc;
border-bottom: solid 1px #ccc;
padding: 0 0 6px 6px;
line-height: 1.35;
margin: 0 0 15px;
}

p.survey_p{
margin: 0 0 30px;
}

p.survey_p:last-child{
margin: 0 0 60px;
}

/*search_step
---------------------------------------------------------------------------*/

section.search_step{
padding: 0 0px 0px;
width: 100%;
}

form.search_step_form{

}

h2.search_step_h2{
background: linear-gradient(to bottom , var(--blue001) , var(--blue002));
color: #fff;
border-radius: 10px 10px 0 0;
font-size: 28px;
line-height: 1;
padding: 22px 0 20px;
text-align: center;
}

.search_step_h2_wrap{
margin: 0 0 0;
position: relative;
}

img.search_step_h2_baloon{
position: absolute;
width: 92px;
top: -24px;
left: -20px;
}

#step_area html {
  line-height: 1;
}
#step_area ol, #step_area ul {
  list-style: none;
}
#step_area table {
  border-collapse: collapse;
  border-spacing: 0;
}
#step_area caption, #step_area th, #step_area td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}
#step_area q, #step_area blockquote {
  quotes: none;
}
#step_area q:before, #step_area q:after, #step_area blockquote:before, #step_area blockquote:after {
  content: "";
  content: none;
}
#step_area a img {
  border: none;
}
#step_area article, #step_area aside, #step_area details, #step_area figcaption, #step_area figure, #step_area footer, #step_area header, #step_area hgroup, #step_area main, #step_area menu, #step_area nav, #step_area section, #step_area summary {
  display: block;
}
#step_area html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
}
#step_area body {
  font-family: "Kosugi Maru","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Lucida Grande",Verdana,"ＭＳ Ｐゴシック",sans-serif;
  color: #696969;
}
#step_area input, #step_area select, #step_area textarea, #step_area button, #step_area option {
  font-family: "Kosugi Maru","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Lucida Grande",Verdana,"ＭＳ Ｐゴシック",sans-serif;
  color: #696969;
  font-size: 1rem;
}
#step_area button {
  cursor: pointer;
}
#step_area a {
  text-decoration: none;
  color: #696969;
}
#step_area input[type="submit"] {
  -webkit-appearance: none;
}

:root {
  --main-color: #5bb75b;
  --sub-color: #ff7e0e;
}

#step_area {
  border-radius: 0 0 10px 10px;
  background: #fff;
  padding: 20px 20px 10px;
  box-shadow: 0px 2px 4px rgba(0,0,0,0.3);
  border: solid 4px var(--blue002);
}
#step_area .step_title {  
  font-size: 24px;
  text-align: center;
  margin: 0 0 10px;
}
#step_area .step_count {
  padding: .5rem;
}
#step_area .step_count ul {
  display: flex;
  justify-content: center;
  margin: 0 0 10px;
}
#step_area .step_count ul li {
  background: #b0b0b0;
  padding: .5rem .5rem .6rem;
  border-radius: 100px;
  color: #ffffff;
  position: relative;
  line-height: 1;
}
#step_area .step_count ul li.active {
  background: #ffd940;
  color: #666;
  font-weight: bold;
}
#step_area .step_count ul li.active:not(:first-of-type):before {
  background: #ffd940;
}
#step_area .step_count ul li:not(:first-of-type) {
  margin-left: 1rem;
}
#step_area .step_count ul li:not(:first-of-type):before {
  content: '';
  display: block;
  background: #b0b0b0;
  height: 2px;
  position: absolute;
  left: -1rem;
  width: 1rem;
  top: 50%;
  transform: translateY(-50%);
}
#step_area .step_body {
  
}
#step_area .step_body .step {
  display: none;
  flex-wrap: wrap;
}
#step_area .step_body .step.open {
  display: flex;
  justify-content: flex-start;
}
#step_area .step_body .step .label_wrap {
  flex-basis: calc((100% - 20px) / 3);
  padding: 0;
  box-sizing: border-box;
}

#step_area .step_body .step .label_wrap:nth-child(3n-1){
margin: 0 10px 10px 10px;
}

#step_area .step_body .step .label_wrap label span {
  font-size: 18px;
  font-weight: bold;
  color: #666;
  padding: .5rem;
  box-sizing: border-box;
  width: 100%;
  display: block;
  text-align: center;
  border: 1px solid var(--sub-color);
  border-radius: 5px;
  transition: .5s background-color,color;
  position: relative;
  background: #FFF4EB;
}

#step_area .step_body .step .label_wrap label span:after{
position: absolute;
content: '\f054';
font-family: "Font Awesome 5 Free";
font-weight: 900;
font-size: 18px;
right: 5px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
color: var(--sub-color);
}


#step_area .step_body .step .label_wrap label input[type="radio"],
#step_area .step_body .step .label_wrap label input[type="checkbox"] {
  display: none;
}
#step_area .step_body .step .label_wrap label input[type="radio"]:checked + span,
#step_area .step_body .step .label_wrap label input[type="checkbox"]:checked + span {
  background: var(--sub-color);
  color: #ffffff;
}
#step_area .step_body .step .button_wrap {
  flex: 100%;
  padding: .5rem 0;
  display: flex;
  justify-content: space-evenly;
}
#step_area .step_body .step .button_wrap .button, #step_area .step_body .step .button_wrap button {
  padding: .2rem 2rem;
  font-size: 14px;
  border: 1px solid #e7e7e7;
  border-radius: 20px;
  font-size: 20px;
}
#step_area button {
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
}

#step_area .step_body .step .button_wrap button.search_start{
background: #ff4b4b;
color: #fff;
}

.search_step_wrap{

}

.search_step_wrap section.search_step{
position: relative;
top: 0;
margin: 0 0 60px;
}

.search_step_wrap form.search_step_form{
width: 100%;
}

.search_step_wrap #step_area{
padding: 20px 60px 10px;
}

/*case
---------------------------------------------------------------------------*/

section.case{
margin: 0 0 60px;
}

h2.case_h2{
font-size: 48px;
margin: 0 0 20px;
}

.case_h2_baloon{
display: inline-block;
line-height: 1;
padding: 15px 15px 17px;
background: var(--blue002);
color: #fff;
font-weight: bold;
border-radius: 10px;
position: relative;
margin: 0 0 15px;
}

.case_h2_baloon:after{
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    border-style: solid;
    border-color: var(--blue002) transparent transparent transparent;
    border-width: 15px 10px 0 10px;
    z-index: 1;
}

ul.case_carousel{
    width: 100%;
    padding: 0px 0 0 ;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
    white-space: nowrap;
    scroll-snap-type: x mandatory;
    margin: 0 0 0;
}

li.case_item{
    scroll-snap-align: start;
    margin: 0 12px 0 0px;
    display: inline-block;
    width: 420px;
    white-space: normal;
    vertical-align: top;
    background: #fff;
    border-radius: 10px;
    padding: 0px;
    border-radius: 10px;
    border: solid 1px #2d85ed;
    background-image: repeating-linear-gradient(to bottom,          /* 横線 */
       transparent 12px,
       rgba(204, 204, 204, 0.20) 13px,  rgba(204, 204, 204, 0.20) 13px,
       transparent 14px,  transparent 25px, 
       rgba(204, 204, 204, 0.20) 26px,  rgba(204, 204, 204, 0.20) 26px,
       transparent 27px,  transparent 38px, 
       rgba(204, 204, 204, 0.20) 39px,  rgba(204, 204, 204, 0.20) 39px,
       transparent 40px,  transparent 51px, 
       rgba(204, 204, 204, 0.20) 52px,  rgba(204, 204, 204, 0.20) 52px,
       transparent 53px,  transparent 64px, 
       rgba(204, 204, 204, 0.20) 65px,  rgba(204, 204, 204, 0.20) 65px),

    repeating-linear-gradient(to right,          /* 縦線 */
       transparent 12px,
       rgba(204, 204, 204, 0.20) 13px,  rgba(204, 204, 204, 0.20) 13px,
       transparent 14px,  transparent 25px, 
       rgba(204, 204, 204, 0.20) 26px,  rgba(204, 204, 204, 0.20) 26px,
       transparent 27px,  transparent 38px, 
       rgba(204, 204, 204, 0.20) 39px,  rgba(204, 204, 204, 0.20) 39px,
       transparent 40px,  transparent 51px, 
       rgba(204, 204, 204, 0.20) 52px,  rgba(204, 204, 204, 0.20) 52px,
       transparent 53px,  transparent 64px, 
       rgba(204, 204, 204, 0.20) 65px,  rgba(204, 204, 204, 0.20) 65px);
}

h3.case_h3{
    background: linear-gradient(to right, #2d85ed, #33ccff );
    color: #fff;
    padding: 15px;
    font-size: 24px;
    border-radius: 9px 9px 0px 0px;
}

section.case_item_main{
padding: 20px;
}

section.case_item_profile{
display: flex;
flex-wrap: nowrap;
align-items: flex-start;
margin: 0 0 20px;
}

img.case_item_userimg{
width: 120px;
}

.case_item_data{
padding: 0 0 0 15px;
}

.case_item_name{
font-size: 28px;
margin: 0 0 15px;
}

.case_item_career{
background: #666;
color: #fff;
font-weight: bold;
display: inline-block;
line-height: 1;
padding: 10px;
border-radius: 5px;
}

p.case_item_description{
font-size: 20px;
font-weight: bold;
}

.case_item_before-after{
display: flex;
justify-content: space-around;
position: relative;
margin: 0 0 20px;
}

.case_item_before-after:after{
	position: absolute;
    font-family: "Font Awesome 5 Free";
    content: "\f0da";
    font-weight: 900;
	font-size: 30px;
    bottom: 32%;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    color: #999;
}

.case_item_before,.case_item_after{
text-align: center;
font-size: 24px;
font-weight: bold;
color: #888;
line-height: 1.25;
position: relative;
padding: 50px 0 0;
}

.case_item_before:after,.case_item_after:after{
position: absolute;
top:0px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
content: 'Before';
font-family: 'Anton', sans-serif, cursive;
font-weight: normal;
text-decoration: underline;
}

.case_item_after{
color: #fe9c3c;
font-size:  28px;
}

.case_item_after:after{
color: #fe9c3c;
content: 'After';
}

h4.case_item_h4{
background: #666;
color: #fff;
display: inline-block;
line-height: 1;
padding: 10px 10px;
margin: 0 0 10px;
border-radius: 5px;
}

ul.case_item_point{
list-style:disc;
padding: 0 0 0 20px;
margin: 0 0 20px;
height: 164px;
}

ul.case_item_point li{
margin: 0 0 10px;
font-weight: bold;
font-size: 24px;
}

ul.case_item_point li:last-child{
margin: 0;
}

.case_item_using-site{
width: 210px;
    margin: 0px auto 20px;
    text-align: center;
    font-size: 16px;
    background-color: #2d85ed;
    color: #fff;
    padding: 8px 0px;
    border-radius: 35px;
    position: relative;
	font-weight: bold;
}

.case_item_using-site:after{
content: "";
    position: absolute;
    width: 0;
    height: 0;
    bottom: -20px;
    left: 95px;
    border-style: solid;
    border-color: #2d85ed transparent transparent transparent;
    border-width: 20px 10px 0 10px;
    z-index: 1;
}

a.case_item_cvbutton{
display: flex;
padding: 15px;
border-radius: 10px;
background: #fe9c3c;
align-items: center;
text-decoration: none;
font-size: 18px;font-weight: bold;
color: #fff;
box-shadow: 0px 4px 0px #cc3300;
}

img.case_item_logo{
width: 50%;
}

.case_item_cvbutton-copy{
padding: 0 0 0 15px;
}

/*method
---------------------------------------------------------------------------*/

section.method{
padding: 0 20px;
margin: 0 0 60px;
}

h2.method_h2{
    display: inline-block;
    line-height: 1;
    padding: 15px 30px 17px;
    background: #fff;
    border: solid 4px var(--blue000);
    color: #3F3F3F;
    font-weight: bold;
    border-radius: 10px;
    position: relative;
    margin: 0 0 15px;
}

h2.method_h2:before{
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    bottom: -18px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    border-style: solid;
    border-color: var(--blue000) transparent transparent transparent;
    border-width: 18px 14px 0 14px;
    z-index: 1;
}

h2.method_h2:after{
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    bottom: -13px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    border-style: solid;
    border-color: #fff transparent transparent transparent;
    border-width: 18px 14px 0 14px;
    z-index: 1;
}

.method_box{
border: solid 12px var(--blue002);
border-radius: 20px;
background: #fff;
margin: 192px 0 0;
position: relative;
padding: 40px;
}

.method_box:before{
position: absolute;
content: '';
width: 536px;
height: 192px;
background-image: url(../images/20s_method_h2_images_01.png);
top: -204px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

.method_item{
text-align: center;
}

.method_item:first-child{
border-bottom: solid 4px var(--blue003);
padding-bottom: 40px;
}

.method_item:last-child{
padding-top: 40px;
}

h3.method_item_h3{
font-size: 36px;
color: var(--blue002);
margin: 0 0 20px;
}

p.method_item_text{
text-align: left;
}

img.method_item_images{
width: 180px;
margin: 0 0 20px;
}

.method_box02_wrap{
margin: 202px 0 0;
padding: 0 20px;
position: relative;
}

.method_box02_wrap:before{
position: absolute;
content: '';
width: 536px;
height: 192px;
background-image: url(../images/20s_method_h2_images_01.png);
top: -192px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

.method_box02{
padding: 0 30px;
border: solid 4px var(--blue002);
border-radius: 10px;
background: #fff;
margin: 0 0 20px;
position: relative;
}

.method_box02:before{
position: absolute;
content: '';
top: 0;
left: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 100px 100px 0 0;
border-color: var(--blue002) transparent transparent transparent;
}

.method_box02:after{
position: absolute;
line-height: 1;
content: '1';
font-size: 40px;
font-weight: bold;
top: 10px;
left: 16px;
color: #fff;
}

.method_box02:nth-child(2):after{
content: '2';
}


h3.method_box02_h3{
text-align: center;
font-size: 36px;
padding: 40px 0;
border-bottom: solid 2px var(--blue002);
margin: 0 0 20px;
}

p.method_box02_text{
font-size: 24px;
margin: 0 0 30px;
line-height: 1.6;
}

p.method_box02_text span.__red{
color: var(--red001);
font-weight: bold;
}

p.method_box02_text span.__blue{
color: var(--blue002);
font-weight: bold;
}

img.method_box02_images{
width: 100%;
margin: 0 0 30px;
}

/*whatis
---------------------------------------------------------------------------*/

section.whatis{
padding: 0 20px;
margin: 0 0 60px;
}

img.whatis_image{
width: 100%;
}

/*hellowork
---------------------------------------------------------------------------*/

section.hellowork{
padding: 0 0;
margin: 0 0 40px;
}

h2.hellowork_h2{
  position: relative;
  padding: 0 0 20px;
  display: inline-block;
  font-size:36px;
  text-align: center;
  border-bottom: solid 4px #888;
  margin: 0 0 30px;
}

h2.hellowork_h2:before{
    content: "";
    position: absolute;
    bottom: -44px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    border: 20px solid transparent;
    border-top: 25px solid #f5f5f5;
    z-index: 2;
}

h2.hellowork_h2:after{
    content: "";
    position: absolute;
    bottom: -50px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    border: 20px solid transparent;
    border-top: 26px solid #888;
    z-index: 1;
}

h2.hellowork_h2 span.__color01{
background: #fe9d3c;
color: #fff;
padding: 0 10px;
}

h2.hellowork_h2 span.__color02{
background: var(--blue002);
color: #fff;
padding: 0 10px;
}

.hellowork_box_wrap{
margin: 0 0 20px;
text-align: center;
}

img.hellowork_box_graph{
width: 710px;
}

.hellowork_box{
flex-basis: calc((100% - 20px) / 2);
}

.hellowork_box_label{
background: #fe9d3c;
color: #fff;
font-size: 36px;
font-weight: bold;
line-height: 1;
padding: 15px 0;
text-align: center;
border-radius: 100px;
margin: 0 0 10px;
}

.hellowork_box.__box02 .hellowork_box_label{
background: var(--blue002);
}

p.hellowork_box_description{
background: #fff2e5;
padding: 20px;
font-size: 24px;
font-weight: bold;
margin: 0 0 10px;
height: 160px;
}

.hellowork_box.__box02 p.hellowork_box_description{
background: var(--blue004);
}

table.hellowork_box_table_merit,table.hellowork_box_table_demerit{
width: 100%;
border-collapse: collapse;
margin: 0 0 10px;
}

table.hellowork_box_table_merit th,table.hellowork_box_table_demerit th{
background: #fe9d3c;
font-size: 28px;
color: #fff;
line-height: 1;
padding: 10px 0 12px;
}

.hellowork_box.__box02 table.hellowork_box_table_merit th,.hellowork_box.__box02 table.hellowork_box_table_demerit th{
background: var(--blue002);
}

table.hellowork_box_table_merit td,table.hellowork_box_table_demerit td{
background: #fff;
padding: 20px 0;
    text-shadow: 2px 2px 0 #fff, 2px 0px 0 #fff, 0px 2px 0 #fff, 0px -2px 0 #fff, -2px 0px 0 #fff, -2px 2px 0 #fff, 2px -2px 0 #fff, -2px -2px 0 #fff;
}

table.hellowork_box_table_merit td{
height: 220px;
background-image: url(../images/20s_hellowork_table_bgicon_01.png);
background-repeat: no-repeat;
background-position: center;
}

table.hellowork_box_table_demerit td{
height: 180px;
background-image: url(../images/20s_hellowork_table_bgicon_02.png);
background-repeat: no-repeat;
background-position: center;
}

ul.hellowork_box_table_list li{
font-size: 24px;
font-weight: bold;
}

ul.hellowork_box_table_list li:before{
content: '・';
}

.hellowork_comment{
display: flex;
align-items: flex-start;
}

.hellowork_comment span.__color01{
color: var(--red001);
font-weight: bold;
}

img.hellowork_comment_icon{
width: 200px;
margin: 0 20px 0 0;
}

.hellowork_comment_text{
    background: var(--blue004);
    padding: 20px;
    border-radius: 10px;
    position: relative;
    font-size: 28px;
}

.hellowork_comment_text:before{
    content: '';
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    left: -20px;
    top: 40px;
    border-right: 20px solid var(--blue004);
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
}

.hellowork_compare_h2_baloon {
    display: inline-block;
    line-height: 1;
    padding: 15px 15px 17px;
    background: #fe9d3c;
    color: #fff;
    font-weight: bold;
    border-radius: 10px;
    position: relative;
    margin: 0 0 15px;
    font-size: 32px;
}

.hellowork_compare_h2_baloon:after {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    border-style: solid;
    border-color: #fe9d3c transparent transparent transparent;
    border-width: 15px 10px 0 10px;
    z-index: 1;
}

.hellowork_compare_h2_baloon_subtitle{
line-height: 1.15;
position: relative;
display: inline-block;
margin: 0 0 10px;
font-weight: bold;
font-size: 28px;
}

.hellowork_compare_h2_baloon_subtitle:before,.hellowork_compare_h2_baloon_subtitle:after{
position: absolute;
bottom: 0;
height: 1.7rem;
content: '';
}

.hellowork_compare_h2_baloon_subtitle:before{
border-left: solid 3px #3F3F3F;
left: -10px;
transform: rotate(-20deg);
}

.hellowork_compare_h2_baloon_subtitle:after {
    border-right: solid 3px #3F3F3F;
    right: -10px;
    transform: rotate(20deg);
}

/*#point-agent
---------------------------------------------------------------------------*/


section.agent{
padding: 0 20px;
margin: 0 0 60px;
}

.agent_wrap{
background: #fff;
padding: 20px;
border-radius: 10px;
margin: 0 0 20px;
}

.point-agent_h2_wrap{
text-align: center;
margin: 0 0 20px;
}

.point-agent_h2_subtitle{
font-size: 32px;
background: #3F3F3F;
display: inline-block;
padding: 5px 20px;
border-radius: 100px;
color: #fff;
font-weight: bold;
}

h2.point-agent_h2{
padding: 30px 0 0;
font-size: 40px;
}

span.point-agent_h2_span-circle{
    padding: 10px 0 0 0;
    background: url(../images/20s_hellowork_table_bgicon_02_40x10.png);
    background-repeat: repeat-x;
    background-size: 40px 10px;
    background-position: 0px 0px;
}

table.point-agent_table{
width: 100%;
border-collapse: collapse;
margin: 0 0 0;
}

table.point-agent_table th{
font-size: 36px;
padding: 0 10px 0 0;
}

table.point-agent_table th:nth-child(odd){
border-right: solid 2px #ccc;
}

table.point-agent_table th:nth-child(even){
padding: 0 0 0 10px;
}

.point-agent_table_th_baloon{
background: #888;
display: inline-block;
padding: 15px 20px 10px;
line-height: 1;
color: #fff;
border-radius: 100px;
position: relative;
margin: 0 0 15px;
}

.point-agent_table_th_baloon.baloon_blue{
background: #2d85ed;
}

.point-agent_table_th_baloon:after{
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    border-style: solid;
    border-color: #888 transparent transparent transparent;
    border-width: 15px 10px 0 10px;
    z-index: 1;
}

.point-agent_table_th_baloon.baloon_blue:after{
border-color: #2d85ed transparent transparent transparent;
}


p.point-agent_table_th_description{
font-size: 20px;
background: #f5f5f5;
padding: 10px;
}

table.point-agent_table td{
font-size: 24px;
width: 50%;
}

table.point-agent_table td{
text-align: center;
font-weight: bold;
}


table.point-agent_table td:nth-child(odd){
padding: 30px 60px 30px 0;
border-right: solid 2px #ccc;
position: relative;
}

table.point-agent_table td:nth-child(odd):after{
position: absolute;
content: '';
background: url(../images/20s_point-agent_table_after01.png);
width: 100px;
height: 100px;
right: -50px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

table.point-agent_table tr:last-child td:nth-child(odd):after{
background: url(../images/20s_point-agent_table_after02.png);
}

table.point-agent_table td:nth-child(even){
padding: 20px 0 20px 60px;
}

span.color-red{
color: #c90e38;
}

span.under-line_yellow{
background: linear-gradient(transparent 50%, #ffffcc 50%);
font-weight: bold;
}

.point-agent_comment{
display: flex;
align-items: flex-start;
margin: 0 0 20px;
}

.point-agent_baloon{
font-size: 24px;
    background: #fff;
    border: solid 2px #666;
    padding: 20px;
    border-radius: 10px;
    position: relative;
}

.point-agent_baloon:after{
    content: '';
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    left: -20px;
    top: 40px;
    border-right: 20px solid #fff;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
}

.point-agent_baloon:before{
    content: '';
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    left: -22px;
    top: 40px;
    border-right: 20px solid #666;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
}

img.point-agent_human{
width: 200px;
}

p.agent_addition{
font-size: 20px;
}

/*topcategory
---------------------------------------------------------------------------*/

section.topcategory{
padding: 0 20px;
margin: 0 0 60px;
}

.topcategory_wrap{
border: solid 2px #666;
background: #fff;
border-radius: 10px;
padding: 20px;
}

.topcategory_item {
    width: 100%;
    
    
}

.topcategory_item:not([open]) {
    margin-bottom: 7px;
}

.topcategory_item summary {
display: block;
    align-items: center;
    position: relative;
    padding: 20px 40px 20px 86px;
    border-radius: 10px;
    background-color: #f0f0f0;
    color: #3F3F3F;
    font-weight: 600;
    cursor: pointer;
    line-height: 1.25;
    font-size: 36px;
}

.topcategory_item summary:not(:last-child){
margin: 0 0 15px;
}

.topcategory_item summary::-webkit-details-marker {
    display: none;
}

.topcategory_item summary::after {
position: absolute;
transform: translateY(-50%) rotate(45deg);
width: 16px;
height: 16px;
right: 40px;
border-bottom: 6px solid #666;
border-right: 6px solid #666;
content: '';
transition: transform .3s;
top: 45%;
-webkit-transform: translateY(-50%) rotate(45deg);
-ms-transform: translateY(-50%) rotate(45deg);
}

.topcategory_item[open] summary::after {
    transform: rotate(225deg);
}

.topcategory_item summary:before{
position: absolute;
content: '';
width: 50px;
height: 50px;
background-image: url(../images/20s_topcatgegory_icon01.png);
background-size: contain;
background-repeat: no-repeat;
left: 20px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}

.topcategory_item summary.__category02:before{
background-image: url(../images/20s_topcatgegory_icon02.png);
}

.topcategory_item summary.__category03:before{
background-image: url(../images/20s_topcatgegory_icon03.png);
}

.topcategory_item summary.__category04:before{
background-image: url(../images/20s_topcatgegory_icon04.png);
}

.topcategory_item summary span.__small{
font-size: 20px;
font-weight: normal;
}

.topcategory_item .topcategory_item_content {
    transform: translateY(-10px);
    opacity: 0;
    margin: 0;
    padding: 0 0 20px;
    color: #333333;
    transition: all .5s ease;
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    box-sizing:border-box;

}

.topcategory_item[open] .topcategory_item_content {
    transform: none;
    opacity: 1;
}

a.topcategory_item_link{
display: block;
flex-basis: calc(50% - 10px);
text-decoration: none;
padding: 20px;
border-radius: 10px;
border: solid 4px #666;
color: #3F3F3F;
font-size: 32px;
font-weight: bold;
position: relative;
}

a.topcategory_item_link:nth-child(odd){
margin: 0 10px 20px 0;
}

a.topcategory_item_link:nth-child(even){
margin: 0 0 20px 10px;
}

a.topcategory_item_link:after{
position: absolute;
font-family: "Font Awesome 5 Free";
content: "\f054";
font-weight: 900;
font-size: 24px;
color: var(--blue002);
right: 14px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}

/*bestone
---------------------------------------------------------------------------*/

section.bestone{
margin: 0 0 60px;
}


h2.bestone_h2{
margin: 0 0 20px;
padding: 30px 0;
font-size: 40px;
color: #fff;
background-image: url(../images/20s_bestone_h2_bgimages01.png);
background-size: 100% auto;
background-position: center;
text-align: center;
position: relative;
}

h2.bestone_h2:after{
content: "";
position: absolute;
width: 0;
height: 0;
bottom: -16px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
border-style: solid;
border-color: #0c407d transparent transparent transparent;
border-width: 16px 12px 0 12px;
z-index: 1;
}

span.bestone_h2_subtitle{
display: inline-block;
line-height: 1;
font-size: 28px;
padding: 10px 0;
border-top: solid 2px #fff;
border-bottom: solid 2px #fff;
margin: 0 0 10px;
}

span.bestone_h2_title{
display: block;
line-height: 1;
}

.bestone_wrap{
padding: 0 20px;
}

.bestone_wrap .pickup_item{
border: solid 2px var(--blue002);
box-shadow: 0px 1px 2px rgb(0 0 0 / 30%);
}

.bestone_wrap .pickup_item_spec_wrap .pickup_item_spec:first-child:after {
display: none;
}

.bestone_wrap .pickup_item{
display: block;
}

.pickup_item_inner{
display: flex;
}

p.pickup_item_notice{
margin: 16px 0 0;
font-size: 20px;
}

/*pickup_top
---------------------------------------------------------------------------*/

section.pickup_top{
background: var(--blue000);
position: relative;
padding: 130px 20px 20px;
margin: 140px 0 60px;
border-radius: 10px;
}

.pickup_top_wrap .pickup_item{
display: block;
}

.pickup_top_wrap img.pickup_item_banner{
width: 240px;
}

.pickup_top_wrap .pickup_item_spec .__label{
font-size: 24px;
line-height: 1;
    padding: 8px 5px 10px;
    border: none;
    background: var(--red001);
    color: #fff;
    margin: 0 10px 0 0;
}

.pickup_top_wrap .pickup_item_spec .__contents{
font-size: 24px;
}

.pickup_top_wrap .pickup_item_spec .__contents b{
font-size: 32px;
}

.pickup_top_wrap .pickup_item_spec_wrap .pickup_item_spec:first-child:after{
display: none;
}

.pickup_top_wrap .pickup_item_spec_wrap{
align-items: center;
white-space: normal;
}

.pickup_top_baloon{
background: #FFFCBD;
width: calc(100% - 80px);
margin: 0 auto 0;
border-radius: 10px;
border: solid 2px var(--blue000);
text-align: center;
position: absolute;
top: -110px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}

.pickup_top_baloon_inner{
padding: 30px 20px 30px;
}

.pickup_top_baloon_inner:after{
content: "";
position: absolute;
width: 0;
height: 0;
bottom: -20px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
border-style: solid;
border-color: #FFFCBD transparent transparent transparent;
border-width: 21px 12px 0 12px;
z-index: 1;
}

.pickup_top_baloon_title{
font-size: 32px;
font-weight: bold;
line-height: 1;
margin: 0 0 16px;
}

.pickup_top_baloon_title:after{

}

.pickup_top_baloon_title span.__big{
font-size: 140%;
color: #fe9c3c
}

p.pickup_top_baloon_text{
font-size: 24px;
}

/*search_step02
---------------------------------------------------------------------------*/

section.search_step.search_step02 #step_area .step_body .step .label_wrap label span{
padding: 6px 4px;
}

section.search_step.search_step02 #step_area .step_body .step .label_wrap label span small{
font-weight: normal;
font-size: 10px;
}


/*result02
---------------------------------------------------------------------------*/

.result_header_baloon{
text-align: center;
}

.result_header_baloon_title{
font-size: 32px;
font-weight: bold;
margin: 0 0 20px;
}

.result_header_baloon_title span.__num{
color: #ff7e0e;
font-size: 140%;
}

.result_header_baloon_description{
font-size: 24px;
padding: 20px;
display: inline-block;
border: solid 2px #ff7e0e;
background: #FFF4EB;
border-radius: 10px;
position: relative;
margin: 0 0 36px;
}

.result_header_baloon_description i{
color: #00cc99;
}

.result_header_baloon_description:before{
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
bottom: -28px;
border-top: 28px solid #ff7e0e;
border-left: 12px solid transparent;
border-right: 12px solid transparent;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}

.result_header_baloon_description:after{
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
bottom: -25px;
border-top: 26px solid #FFF4EB;
border-left: 11px solid transparent;
border-right: 11px solid transparent;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}

/*befoaf
---------------------------------------------------------------------------*/

section.befoaf{
margin: 0 0 60px;
}

h2.befoaf_h2{
display: inline-block;
font-size: 32px;
line-height: 1;
padding: 20px 30px;
background: var(--blue000);
color: #fff;
border-radius: 100px;
margin: 0 0 20px;
}

h2.befoaf_h2:before,h2.befoaf_h2:after{
content: '-';
margin: 12px;
}

.befoaf_item_wrap{
display: flex;
width: 100%;
margin: 0 0 20px;
}

.befoaf_item{
width: calc(100% - 10px);
background: #fff;
border-radius: 10px;
padding: 20px;
margin: 0 10px 0 0;
}

.befoaf_item:last-child{
margin: 0 0 0 10px;
}

.befoaf_item_title{
border-bottom: solid 4px #000;
display: inline-block;
line-height: 1;
padding: 10px 20px 10px 30px;
margin: 24px 0 40px 80px;
position: relative;
}

.befoaf_item_title:before{
position: absolute;
content: '';
width: 100px;
height: 100px;
background-image: url(../images/20s_befoaf_sales_profileicon_01.png);
background-size: contain;
left: -80px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}

.befoaf_item.__item02 .befoaf_item_title:before{
background-image: url(../images/20s_befoaf_sales_profileicon_02.png);
}

.befoaf_item.__item03 .befoaf_item_title:before{
background-image: url(../images/20s_befoaf_sales_profileicon_03.png);
}

.befoaf_item.__item04 .befoaf_item_title:before{
background-image: url(../images/20s_befoaf_sales_profileicon_04.png);
}

.befoaf_item.__item05 .befoaf_item_title:before{
background-image: url(../images/20s_befoaf_sales_profileicon_05.png);
}

.befoaf_item.__item06 .befoaf_item_title:before{
background-image: url(../images/20s_befoaf_sales_profileicon_06.png);
}

.befoaf_item_before,.befoaf_item_after{
padding: 20px 20px 20px 100px;
background: var(--blue005);
border-radius: 10px;
font-weight: bold;
font-size: 28px;
position: relative;
}

.befoaf_item_before span.__small,.befoaf_item_after span.__small{
font-size: 22px;
font-weight: normal;
}

.befoaf_item_before:before,.befoaf_item_after:before{
position: absolute;
content: '';
width: 60px;
height: 60px;
background-image: url(../images/20s_befoaf_sales_icon_before.png);
background-size: contain;
left: 20px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}

.befoaf_item_before{
margin: 0 0 20px;
position: relative;
}

.befoaf_item_before:after{
position: absolute;
font-family: "Font Awesome 5 Free";
content: "\f063";
font-weight: 900;
font-size: 24px;
color: var(--red001);
bottom: -24px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}

.befoaf_item_after{
background: var(--blue001);
color: #fff;
}

.befoaf_item_after:before{
background-image: url(../images/20s_befoaf_sales_icon_after.png);
}

.befoaf_comment{
padding: 36px;
border: solid 4px #000;
border-radius: 10px;
background: #fff;
}

p.befoaf_comment_text{
font-size: 28px;
padding: 0 0 0 140px;
position: relative;
font-weight: bold;
}

p.befoaf_comment_text span.__color01{
color: var(--red001);
}

p.befoaf_comment_text:before{
position: absolute;
content: '';
width: 120px;
height: 120px;
background-image: url(../images/20s_befoaf_sales_comment_icon.png);
background-size: contain;
left: 0px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}

a.befoaf_linkbutton{
position: relative;
display: block;
padding: 30px 0;
border-radius: 1000px;
font-size: 32px;
font-weight: bold;
background: #a91727;
color: #fff;
text-decoration: none;
width: 100%;
max-width: 620px;
line-height: 1;
text-align: center;
margin: 20px auto 0;
box-shadow: 0 8px 0 #600D16;
}

a.befoaf_linkbutton:after{
position: absolute;
font-family: "Font Awesome 5 Free";
content: "\f105";
font-weight: 900;
right: 20px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}

section.befoaf.befoaf_highclass .befoaf_item_after{
background: #1d3e72;
}

h2.bestone_h2 span.__orange{
color: #FFB92E;
}

/*result02
---------------------------------------------------------------------------*/

.result02_item{
padding: 20px;
box-shadow: 0px 2px 4px rgb(0 0 0 / 30%);
margin: 0 0 30px;
background: #fff;
border-radius: 10px;
border: solid 2px var(--blue001);
}

.result02_item h3.ranking_item_header_h3{
width: 100%;
}

/*compare02
---------------------------------------------------------------------------*/

section.compare02{
overflow-x: hidden;
margin: 0 0 60px;
}

h2.cpmpare02_h2{
font-size: 56px;
text-align: center;
margin: 0 0 20px;
}

h2.cpmpare02_h2 span.__color01{
color: var(--blue001);
}

span.cpmpare02_h2_subtitle{
display: inline-block;
line-height: 1;
padding: 10px;
border-top: solid 4px #3F3F3F;
border-bottom: solid 4px #3F3F3F;
font-size: 36px;
}

.cpmpare02_table_wrap {
overflow-x: scroll;
padding: 0 0 0;
}

.cpmpare02_table_wrap.__baloon_visible{
padding: 60px 0 0;
}

table.cpmpare02_table{
width: 100%;
border-collapse: collapse;
white-space: nowrap;
table-layout: fixed;
background-color: #fff;
}

table.cpmpare02_table th{
width: 140px;
font-size: 22px;
padding: 20px 0;
background: #F2F0ED;
border: solid 2px #ccc;
left: 0;
}

table.cpmpare02_table td{
font-size: 26px;
text-align: center;
white-space: normal;
width: 300px;
border: solid 2px #ccc;
padding: 20px 20px;
background: #fff;
position: relative;
}

.__service_baloon{
position: absolute;
top: -54px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
white-space: nowrap;
}

.__service_baloon_inner{
position: relative;
font-size: 22px;
background: var(--red001);
color: #fff;
border-radius: 100px;
line-height: 1;
padding: 0px 12px 0px 44px;
height: 48px;
line-height: 48px;
}

.__service_baloon_inner:after{
content: "";
position: absolute;
width: 0;
height: 0;
bottom: -15px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
border-style: solid;
border-color: var(--red001) transparent transparent transparent;
border-width: 16px 8px 0 8px;
z-index: 1;
}

.__service_baloon_inner:before{
position: absolute;
content: '';
width: 48px;
height: 48px;
background-size: contain;
background-repeat: no-repeat;
background-image: url(../images/20s_compare02_service_baloon01.png);
border-radius: 100px;
border: solid 4px var(--red001);
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
left: -8px;
}

.__service_baloon_inner.__baloon02{
background: #00a678;
}

.__service_baloon_inner.__baloon02:after{
border-color: #00a678 transparent transparent transparent;
}

.__service_baloon_inner.__baloon02:before{
background-image: url(../images/20s_compare02_service_baloon02.png);
border: solid 4px #00a678;
}

.__service_baloon_inner.__baloon02{
background: #00a678;
}

.__service_baloon_inner.__baloon02:after{
border-color: #00a678 transparent transparent transparent;
}

.__service_baloon_inner.__baloon02:before{
background-image: url(../images/20s_compare02_service_baloon02.png);
border: solid 4px #00a678;
}

.__service_baloon_inner.__baloon03{
background: #476DFF;
}

.__service_baloon_inner.__baloon03:after{
border-color: #476DFF transparent transparent transparent;
}

.__service_baloon_inner.__baloon03:before{
background-image: url(../images/20s_compare02_service_baloon03.png);
border: solid 4px #476DFF;
}

.__service_baloon_inner.__baloon04{
background: #005CCB;
}

.__service_baloon_inner.__baloon04:after{
border-color: #005CCB transparent transparent transparent;
}

.__service_baloon_inner.__baloon04:before{
background-image: url(../images/20s_compare02_service_baloon04.png);
border: solid 4px #005CCB;
}

.__service_baloon_inner.__baloon05{
background: #188065;
}

.__service_baloon_inner.__baloon05:after{
border-color: #188065 transparent transparent transparent;
}

.__service_baloon_inner.__baloon05:before{
background-image: url(../images/20s_compare02_service_baloon05.png);
border: solid 4px #188065;
}


a.__service_banner_wrap{
display: inline-block;
margin: 0 0 10px;
}

img.__service_banner{
width: 200px;
}

a.__service_textlink{
display: inline-block;
line-height: 1.3;
font-size: 24px;
text-decoration: none;
}

a.__service_textlink:after{
font-family: "Font Awesome 5 Free";
  content: "\f35d";
  font-weight: 900;
  font-size: 20px;
  margin: 0 0 0 4px;
}

tr.cpmpare02_table__service td{
vertical-align: top;
}

tr.cpmpare02_table__service td span.__inlineblock{
display: inline-block;
}

tr.cpmpare02_table__score td{
font-size: 28px;
}

span.__score_strong{
font-size: 36px;
font-family: 'Anton', sans-serif, cursive;
color: #ff4b4b;
}

.__score_wrap:before{
font-family: "Font Awesome 5 Free";
  content: "\f005";
  font-weight: 900;
color: #FFD700;
vertical-align: 0px;
margin: 0 4px 0 0;
}

span.__amount_strong{
font-weight: bold;
font-size: 28px;
color: #000;
}

table.cpmpare02_table td.ev01,table.cpmpare02_table td.ev02,table.cpmpare02_table td.ev03{
height: 120px;
background-repeat: no-repeat;
background-size: 100px;
background-position: center;
background-color: rgba(255,255,255,0.5);
background-blend-mode: lighten;
text-shadow: 2px 2px 0 #fff, 2px 0px 0 #fff, 0px 2px 0 #fff, 0px -2px 0 #fff, -2px 0px 0 #fff, -2px 2px 0 #fff, 2px -2px 0 #fff, -2px -2px 0 #fff;
}

table.cpmpare02_table td.ev01{
background-image: url(../images/hoiku_compare_icon01.png);
}

table.cpmpare02_table td.ev02{
background-image: url(../images/hoiku_compare_icon02.png);
}

tr.cpmpare02_table__description td{
vertical-align: top;
}

p.__description_text{
text-align: left;
}

p.__description_text span.__color01{
font-weight: bold;
color: var(--red001);
}

span.__area_strong{
font-weight: bold;
}

span.__occupation_strong{
font-weight: bold;
}

a.__link_linkbutton{
text-decoration: none;
display: inline-block;
color: #fff;
font-weight: bold;
font-size: 22px;
background: #ff3300;
box-shadow: 0px 6px 0px #B62400;
padding: 10px 48px;
line-height: 1.25;
border-radius: 10px;
position: relative;
overflow: hidden;
}

a.__link_linkbutton:after{
content: "";
    display: block;
    width: 20px;
    height: 100%;
    position: absolute;
    top: -180px;
    left: 0;
    background-color: #FFF;
    opacity: 0;
    transform: rotate(45deg);
    animation: reflect 2s ease-in-out infinite;
    -webkit-transform: rotate(45deg);
    -webkit-animation: reflect 2s ease-in-out infinite;
}

ul.__ocupation_list{
display: inline-block;
text-align: left;
}

ul.__ocupation_list li{
font-weight: bold;
list-style: square;
}

ul.__ocupation_list li span.__all{
font-size: 32px;
}

.__skills_detail_title{
font-weight: bold;
}

.__skills_detail_title:before{
content: '\f071';
    font-family: "Font Awesome 5 Free";
    font-weight: 700;
    color: var(--red001);
margin: 0 4px 0 0;
}

p.__skills_detail{
font-size: 20px;
line-height: 1.25;
padding: 16px 8px;
background: var(--pink004);
}

/*newrank
---------------------------------------------------------------------------*/

section.newrank{
}


h2.newrank_h2{
    margin: 0 0 20px;
    padding: 50px 0 30px;
    color: #fff;
    background-image: url(../images/20s_bestone_h2_bgimages01.png);
    background-size: 100% auto;
    background-position: center;
    text-align: center;
    position: relative;
font-size: 52px;
margin: 90px 0 80px;
}

h2.newrank_h2 .__subtitle{
display: inline-block;
padding: 10px 10px;
line-height: 1;
font-size: 28px;
font-weight: normal;
}

.newrank_h2_baloon_wrap{
position: absolute;
top: -30px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
white-space: nowrap;
}

.newrank_h2_baloon{
display: inline-block;
line-height: 1;
padding: 15px 30px;
border-radius: 100px;
border: solid 6px #0c407d;
background: #fff;
font-weight: bold;
font-size: 24px;
position: relative;
color: #3F3F3F;
}

.newrank_h2_baloon:after{
content: "";
position: absolute;
width: 0;
height: 0;
bottom: -16px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
border-style: solid;
border-color: #FFF transparent transparent transparent;
border-width: 16px 10px 0 10px;
z-index: 1;
}


.newrank_box{
background: #E8E4DC;
position: relative;
padding: 70px 0px 20px 20px;
margin: 0 0 80px;
}

.newrank_header{

}

.newrank_h3_wrap{
position: absolute;
top:-50px;
left: 0;
}

h3.newrank_h3{
background: linear-gradient(180deg, #094CBF 0%, #094CBF 50%, var(--blue001) 50%, var(--blue001) 100%);
display: inline-block;
justify-content: center;
align-items: center;
width: 100%;
height: 80px;
line-height: 80px;
font-size: 36px;
padding: 0 20px;
color: #fff;
position: relative;
}

h3.newrank_h3:before{
position: absolute;
content: '';
display: block;
width: 0;
height: 0;
border-style: solid;
border-color: #094CBF transparent transparent transparent;
border-width: 40px 30px 0px 0px;
right: -30px;
top: 0;
}

h3.newrank_h3:after{
position: absolute;
content: '';
display: block;
width: 0;
height: 0;
border-style: solid;
border-color: transparent transparent transparent var(--blue001);
border-width: 40px 0px 0px 30px;
right: -30px;
bottom: 0;
}

h3.newrank_h3 i{
display: inline-block;
content: '';
width: 42px;
height: 42px;
background-image: url(../images/20s_newrank_h3_icon.png);
background-size: contain;
opacity: 0.6;
vertical-align: -4px;
margin: 0 10px 0 0;
}

.newrank_target{
padding: 30px 20px 20px;
border-radius: 10px;
background: #fff;
border: solid 2px #7E6F54;
position: relative;
margin: 0 0 30px;
width: calc(100% - 20px);
}

 .newrank_target .__label{
 position: absolute;
 font-size: 24px;
 line-height: 1;
 font-weight: bold;
 top:-25px;
 left: -1;
 padding: 10px 15px;
 background: #7E6F54;
 color: #fff;
 border-radius: 10px 10px 10px 0px;
 }

.newrank_target p.__description{
font-size: 22px;
margin:10px 0 0;
}

.newrank_target p.__description strong{
background:linear-gradient(transparent 60%, #ffffb2 60%);
}

ul.newrank_list{
display: flex;
justify-content: center;
flex-wrap: wrap;
}

ul.newrank_list li{
font-weight: bold;
margin: 0 20px 0 0;
}

ul.newrank_list li:before{
content: '\f058';
    font-family: "Font Awesome 5 Free";
    font-weight: 700;
    color: #00cc99;
    margin: 0 4px 0 0;

}

ul.newrank_caroucel{
width: 100%;
padding: 8px 0 10px;
overflow-x: scroll;
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
white-space: nowrap;
scroll-snap-type: x mandatory;
margin: 0 0 0;
}

li.newrank_caroucel_item{
scroll-snap-align: start;
margin: 0 12px 0 0px;
display: inline-block;
width: 380px;
white-space: normal;
vertical-align: top;
background: #fff;
border-radius: 10px;
text-align: center;
padding: 20px;
position: relative;
box-shadow: 0px 2px 4px rgb(0 0 0 / 30%);
}

li.newrank_caroucel_item .__header_rank{
    position: absolute;
    height: 63px;
    width: 54px;
    background-image: url(../images/aga_ranking-item_rank-icon04.png);
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    font-weight: bold;
    font-size: 28px;
    padding: 8px 0 0;
    left: 10px;
    top: -16px;
}

ul.newrank_caroucel li.newrank_caroucel_item:nth-child(1) .__header_rank{
background-image: url(../images/aga_ranking-item_rank-icon01.png);
}

ul.newrank_caroucel li.newrank_caroucel_item:nth-child(2) .__header_rank{
background-image: url(../images/aga_ranking-item_rank-icon02.png);
}

ul.newrank_caroucel li.newrank_caroucel_item:nth-child(3) .__header_rank{
background-image: url(../images/aga_ranking-item_rank-icon03.png);
}

ul.newrank_caroucel li.newrank_caroucel_item:nth-child(2){

}

li.newrank_caroucel_item .__service_wrap{
display: flex;
align-items: center;
height: 82px;
margin: 0 0 25px;
}

li.newrank_caroucel_item a.__service{
font-size: 32px;
font-weight: bold;
display: inline-block;
flex: 1;
line-height: 1.35;
color: #094CBF;
}

li.newrank_caroucel_item a.__service span.__inlineblock{
display: inline-block;
text-decoration: underline;
}

li.newrank_caroucel_item .__spec_wrap{
display: flex;
width: 100%;
}

li.newrank_caroucel_item img.__banner{
width: 150px;
}

li.newrank_caroucel_item a.__banner_wrap{
display: inline-block;
margin: 0 12px 0 0;
}

li.newrank_caroucel_item .__spec{
width: 100%;
}

li.newrank_caroucel_item .__spec_amount{
font-size: 20px;
position: relative;
background: var(--blue005);
width: 100%;
padding: 16px 0 4px;
margin: 0 0 20px;
}

li.newrank_caroucel_item .__spec_amount span.__strong{
font-weight: bold;
font-size: 24px;
}

li.newrank_caroucel_item .__spec_amount_label{
position: absolute;
white-space: nowrap;
color: var(--blue001);
font-weight: bold;
line-height: 1;
padding: 4px 8px;
border-radius: 6px;
top: -12px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}

li.newrank_caroucel_item p.__description{
font-size: 26px;
    background-image: linear-gradient(180deg, #E8E4DC 1px, transparent 1px);
    background-size: 100% 2em;
    line-height: 2.0em;
    padding-bottom: 4px;
    margin: 0 0 20px;
    text-align: left;
    height: 160px;
    overflow: hidden;
}

li.newrank_caroucel_item a.__linkbutton{
display: block;
text-decoration: none;
font-size: 24px;
border-radius: 100px;
text-align: center;
color: #fff;
font-weight: bold;
background: #ff3300;
box-shadow: 0 6px 0 #B62400;
padding: 16px 0;
width: calc(100% - 20px);
margin: 0 auto 6px;
}

p.newrank_notice{
margin: 15px 0 0;
color: #666;
font-size: 20px;
}

section.newrank.newrank_nottop{
margin: 120px 0 60px;
}

/*combi
---------------------------------------------------------------------------*/

section.combi{
margin: 0 0 60px;
}

table.combi_table{
border-collapse: separate;
border-spacing: 10px;
}

th.combi_table_th_01{
color: #fff;
background: #005CCB;
font-size: 28px;
border-radius: 10px 0 0 10px;
width: 64px;
}

th.combi_table_th_02{
font-weight: normal;
background: #4B96EF;
color: #fff;
font-size: 26px;
padding:16px;
text-align: left;
position: relative;
text-shadow: 0px -1px 0px var(--blue000);
}

th.combi_table_th_02:after{
content: "";
position: absolute;
left: 100%;
border: 24px solid transparent;
border-left: 18px solid #4B96EF;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}

p.combi_table_description{
font-size: 22px;
font-weight: bold;
}

.combi_table_title{
position: relative;
font-weight: bold;
padding: 0 0 0 70px;
margin: 0 0 20px;
}

.combi_table_title:before{
position: absolute;
content: '１';
font-weight: normal;
padding: 15px;
background: var(--blue003);
line-height: 1;
color: var(--blue002);
border-radius: 1000px;
left: 0;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
font-size: 28px;
text-shadow: none;
}

table.combi_table tr:nth-child(2) .combi_table_title:before{
content: '２';
}

table.combi_table tr:nth-child(3) .combi_table_title:before{
content: '３';
}

.combi_table_label{
text-align: center;
line-height: 1.3;
}

td.combi_table_td{
text-align: center;
padding: 16px;
background: var(--blue004);
border: solid 2px var(--blue002);
border-radius: 0 10px 10px 0;
width: 220px;

}

a.combi_banner_wrap{
display: block;
margin: 0 auto 8px;
width: calc(100% - 16px);
}

img.combi_banner{
width: 100%;
}

a.combi_table_textlink{
font-size: 20px;
line-height: 1.3;
font-weight: bold;
text-decoration: underline;
}

a.combi_table_textlink span.__inlineblock{
display: inline-block;
text-decoration: underline;
}

table.combi_table.__table02 th.combi_table_th_01{
background: #B73858;
}

table.combi_table.__table02 th.combi_table_th_02{
background: #D35A78;
text-shadow: 0px -1px 0px #964055;
}

table.combi_table.__table02 td.combi_table_td{
background: #F8E7EB;
border: solid 2px #D35A78;
}



table.combi_table.__table02 .combi_table_title:before{
background: #F8E7EB;
color: #D35A78;
}

table.combi_table.__table02 th.combi_table_th_02:after{
border-left: 18px solid #D35A78;
}

table.combi_table.__table03 th.combi_table_th_01{
background: #188065;
}

table.combi_table.__table03 th.combi_table_th_02{
background: #48AA91;
text-shadow: 0px -1px 0px #2D6B5B;
}

table.combi_table.__table03 td.combi_table_td{
background: #E4F2EF;
border: solid 2px #48AA91;
}

table.combi_table.__table03 .combi_table_title:before{
background: #E3F0EC;
color: #48AA91;
}

table.combi_table.__table03 th.combi_table_th_02:after{
border-left: 18px solid #48AA91;
}

.combi_h2_02_wrap{
position: relative;
z-index: 0;
background: var(--blue001);
text-align: center;
overflow: hidden;
padding: 60px 0 40px;
margin: 0 0 20px;
border-radius: 8px;
}

.combi_h2_02_wrap:before{
  content: '';
  position: absolute;
  left:40%;
  top: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  background: #094CBF;
  transform: skewX(30deg);
  transform-origin: top right;
  z-index: -1;
}


h2.combi_h2_02{
color: #fff;
font-size: 48px;
text-shadow: 0px 4px 0px rgb(0 0 0 / 20%);
}

h2.combi_h2_02:before{
display: inline-block;
content: '自分に\A合った';
white-space: pre;
font-size: 20px;
background: #FFD700;
text-shadow: none;
color: #3F3F3F;
padding: 22px 20px;
border-radius: 100px;
line-height: 1.35;
margin: 0 12px 0 0;

}

.combi_h2_02_subtitle{
color: #fff;
font-size: 32px;
text-shadow: 0px 4px 0px rgb(0 0 0 / 20%);
}

.combi_h2_02_subtitle span.__underline{
border-bottom: solid 4px #fff;
font-weight: bold;
}

/*newgrad_tab
---------------------------------------------------------------------------*/

.newgrad_tab01_wrap {
  display: flex;
  flex-wrap: wrap;
  margin:10px 0 0;
  align-items: flex-end;
}
.newgrad_tab01_wrap:after {
  content: '';
  width: 100%;
  height: 4px;
  background: #F98D29;
  display: block;
  order: -1;
}
.newgrad_tab01_label {
  color: White;
  font-size: 26px;
  background: #bbb;
  font-weight: bold;
  text-shadow: 0 -1px 0 rgba(0,0,0,.4);
  white-space: nowrap;
  text-align: center;
  padding: 16px 0;
  order: -1;
  position: relative;
  z-index: 1;
  cursor: pointer;
  border-radius: 8px 8px 0 0;
  width: calc((100% - 300px)/2);
}
.newgrad_tab01_label:not(:last-of-type) {
  margin-right: 5px;
}
.newgrad_tab01_content {
  width: 100%;
  height: 0;
  overflow: hidden;
  opacity: 0;
}
/* アクティブなタブ */
.newgrad_tab01_switch:checked+.newgrad_tab01_label {
  background: #F98D29;
  padding: 26px 0;
  width: 290px;
  font-size: 32px;
}

.newgrad_tab01_switch:checked+.newgrad_tab01_label:after{

}

.newgrad_tab01_switch:checked+.newgrad_tab01_label+.newgrad_tab01_content {
  height: auto;
  overflow: auto;
  padding: 20px 0 0;
  opacity: 1;
  transition: .5s opacity;
}
/* ラジオボタン非表示 */
.newgrad_tab01_switch {
  display: none;
}


.newgrad_tab02_wrap {
  display: flex;
  flex-wrap: wrap;
  margin:10px 0 0;
  align-items: flex-end;
}
.newgrad_tab02_wrap:after {
  content: '';
  width: 100%;
  height: 4px;
  background: #F98D29;
  display: block;
  order: -1;
}
.newgrad_tab02_label {
  color: White;
  font-size: 26px;
  background: #bbb;
  font-weight: bold;
  text-shadow: 0 -1px 0 rgba(0,0,0,.4);
  white-space: nowrap;
  text-align: center;
  padding: 16px 0;
  order: -1;
  position: relative;
  z-index: 1;
  cursor: pointer;
  border-radius: 8px 8px 0 0;
  width: calc((100% - 300px)/2);
}
.newgrad_tab02_label:not(:last-of-type) {
  margin-right: 5px;
}
.newgrad_tab02_content {
  width: 100%;
  height: 0;
  overflow: hidden;
  opacity: 0;
}
/* アクティブなタブ */
.newgrad_tab02_switch:checked+.newgrad_tab02_label {
  background: #F98D29;
  padding: 26px 0;
  width: 290px;
  font-size: 32px;
}

.newgrad_tab02_switch:checked+.newgrad_tab02_label:after{

}

.newgrad_tab02_switch:checked+.newgrad_tab02_label+.newgrad_tab02_content {
  height: auto;
  overflow: auto;
  padding: 20px 0 0;
  opacity: 1;
  transition: .5s opacity;
}
/* ラジオボタン非表示 */
.newgrad_tab02_switch {
  display: none;
}

/*post
---------------------------------------------------------------------------*/

section.post{
padding: 0 0;
margin: 20px 0 60px;
}

h2.post_h2{
    padding: 30px 20px;
    line-height: 1.2;
    font-size: 40px;
    color: #fff;
    background: linear-gradient(to right, #2d85ed, #33ccff );
    margin: 0 0px 20px;
    border-radius: 4px;
}

span.post_h2_subtitle{
font-size: 20px;
}

.post_date{
    color: #666666;
    font-size: 20px;
    text-align: right;
    margin-bottom: 20px;
}

.post_date:before{
    font-family: "Font Awesome 5 Free";
    content: "\f017";
    font-weight: 900;
    margin-right: 4px;
    color: #ccc;
}

p.post_desciption{
font-size: 24px;
margin: 0 0 40px;
}

h3.post_h3{
    color: #3F3F3F;
    padding: 0 0 10px;
    margin: 0px 0px 20px;
    font-size: 32px;
    position: relative;
    border-bottom: 6px solid #2d85ed;
}

h3.post_h3:before{
    position: absolute;
    bottom: -6px;
    left: 0;
    width: 20%;
    height: 6px;
    content: '';
    background: #33ccff;
}

h4.post_h4{
font-size: 24px;
    margin: 0 0 20px;
    padding: 8px 8px;
    color: #494949;
    background: transparent;
    border-left: solid 6px #2d85ed;
}

h2.post_h2_list{
    text-align: center;
    background: linear-gradient(to right, #2d85ed, #33ccff );
    color: #fff;
    font-size: 40px;
    line-height: 1.2;
    padding: 30px;
    margin: 0 0 40px;
}

span.post_h2_list_subtitle{
display: block;
font-size: 20px;
}

h3.post_h3_list{
    font-size: 32px;
    border-left: solid 6px #2d85ed;
    line-height: 1;
    padding: 0 0 0 10px;
    margin: 0 0 20px;
}

ul.post_list{
padding: 0 20px;
margin: 0 0 40px;
}

ul.post_list li{
margin: 0 0 20px;
}

ul.post_list a{
color: #3F3F3F;
text-decoration: none;
position: relative;
font-weight: bold;
}

ul.post_list a:before{
    font-family: "Font Awesome 5 Free";
    content: "\f0da";
    font-weight: 900;
    color: #2d85ed;
    margin: 0 8px 0 0;
}

/*column_menu
---------------------------------------------------------------------------*/

section.column_menu{
padding: 0 20px;
margin: 0 0 60px;
}

ul.column_menu_list{
    background: #fff;
    border-radius: 10px 10px 0px 0px;
    border: solid 2px #ccc;
}
ul.column_menu_list a{
    text-decoration: none;
    color: #3F3F3F;
    font-size: 24px;
    display: block;
    position: relative;
    font-weight: bold;
}

ul.column_menu_list a:not(:last-child):before{
    position: absolute;
    content: '\f054';
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 16px;
    left: 20px;
    color: #ccc;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

ul.column_menu_list a:not(:last-child):after{
    position: absolute;
    display: block;
    content: '';
    background: #ccc;
    width: calc(100% - 40px);
    height: 1px;
    left: 20px;
    bottom: 0px;
}

ul.column_menu_list li{
padding: 20px 20px 20px 40px;
}

ul.column_menu_list a:last-child{
    font-size: 16px;
    text-align: center;
    background: var(--blue004);
    font-weight: bold;
}

ul.column_menu_list a:last-child li{
    padding: 10px 10px;
    border-top: solid 1px #ccc;
}

ul.column_menu_list a:last-child li i{
margin: 0 0 0 5px;
}

section.fv.__haken_fv{
  margin: 0 0 10px;
}

.v2_slider {
  ul {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    background-color: #fff;
    margin-top: 0px;
  }
  li {
    height: 40px;
    max-width: 100px;
    img {
      object-fit: contain;
      width: 100%;
      height: 100%;
    }
  }

  /* PC版では6個目以降を非表示 */
  li:nth-child(n + 6) {
    display: none;
  }
}

@keyframes marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}




/*画面幅～750px
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:768px){

.sp{
display: block;
}

body{
font-size: 14px;
}



/*コンテンツ
---------------------------------------------------------------------------*/


#contents{
width: 100%;
margin:0;
overflow: hidden;
}

.inner{
box-sizing: border-box;
width: 100%;

}


/*_new
---------------------------------------------------------------------------*/

header{
width: 100%;
padding: 16px 16px 16px;
overflow: hidden;
background: #fff;
}

.header-wrap{
padding: 0;
border-bottom: none;
}

.header-wrap img.logo{
width: 136px;
}


img.logo-link{
width: 140px;
}
.tablesorter-default{
font-size: 10px;
}

#search.search-result{
margin: 0 0 5px;
}

#page_top{
  right: 10px;
  bottom: 10px;
  background: #3f98ef;
  opacity: 0.8;
  border-radius: 50%;
}


/*nav
---------------------------------------------------------------------------*/


.hamburger-menu{
width: 24px;
height: 24px
}

.hamburger-menu__line{
height: 3px;
}

.hamburger-menu__line:before{
transform:translateY(-9px);
height: 3px;
}

.hamburger-menu__line:after{
transform: translateY(9px);
height: 3px;
}

.nav-sp{
width: 50vw;
right: -50vw;
padding: 60px 0px 0px;
}

header .btn-wrap a{
font-size: 12px;
padding: 0 5px 10px 10px;
font-weight: bold;
}

header .btn-wrap a i{
margin: 0 5px 0 0;
}

.nav_li_label{
margin: 0 0 10px;
font-size: 12px;
}

#search{
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
top:225px;
}

section.result #search{
position: relative;
top:0px;
padding: 20px 20px 0px;
}

section.result #search .form-wrap{
margin: 0 0 10px;;
padding: 0;
}

#search .form-wrap{
padding: 0px 10px;
margin: 0 0 20px;
}

#search h2{
font-size: 14px;
border-radius: 10px 10px 0px 0px;
padding: 10px 0px;
}

#search .form-wrap form{
padding: 15px;
border-radius: 0 0 10px 10px;
width: calc(100vw - 40px);
}

#search select{
padding: 10px 10px 10px 150px;
font-size: 14px;
margin: 0 0 10px;
}

#search .select-wrap{
margin: 0 0 10px;
}

#search .select-wrap:last-child{
margin: 0;
}

#search .select-wrap:before{
left: 15px;
font-size: 12px;
top: 20px;
}


.acd-check:checked + .acd-label + .acd-content{
padding: 10px 0;
height: 140px;
}

.acd-label{
margin: 10px auto 0px;
}

.acd-content table td{
font-size: 12px;
padding: 10px;
}

#search input[type="submit"]{
font-size: 14px;
height: 40;
margin: 10px auto 0px;
height: 35px;
}



.tab-wrap {
  display: flex;
  flex-wrap: wrap;
  margin:10px auto 0;
  
}
.tab-wrap:after {
}

.tab-label {
padding: 0.5rem 1rem;
font-size: 16px;
text-shadow: none;
}

.tab-label:not(:last-of-type) {
  margin-right: 5px;
}

.tab-content {
}

/* アクティブなタブ */
.tab-switch:checked+.tab-label {
  

}

.tab-switch:checked+.tab-label+.tab-content {
padding: 20px 0 0;

}

/* ラジオボタン非表示 */
.tab-switch {
}


/*fv
----------------------------------------------------------------------*/

section.fv{
margin: 0 0 20px;
}

.fv_inner{
background-size: contain;
padding: 41vw 10px 0;
}

.fv_inner_area{
width: 100%;
background-size: contain;
padding: 40vw 0 0;
}

.fv_inner_category{
width: 100%;
background-size: contain;
padding: calc((350/750)*100vw) 0 0;
}

.fv_area_text{
font-size: 5.8vw;
width: 30.6vw;
text-align: center;
top: 18.13vw;
left: 4.53vw;
}

img.fv_agent_button{
width: 100%;
}

a.fv_agent_button_wrap{
margin: 10px 0 0;
display: inline-block;
}

img.fv_haken_button{
width: calc(100% - 20px);
}

a.fv_haken_button_wrap{
margin: 20px 0 0;
display: inline-block;
}

a.fv_game_button_wrap{
margin: 15px 0 0;
}

.fv_inner_top{
padding: 40vw 0px 0;
background-size: 100% auto;
}

.fv_inner_top02{
padding: 60vw 0px 0;
background-size: 100% auto;
}

.fv_inner_lp{
background-size: contain;
padding: 44vw 0px 0;
}

.fv_inner.fv_inner_index00{
padding: 43vw 5px 0;
}


.fv_looplogo{
height: 10.6vw;
width: 100%;
margin: 0 0 20px;
}

.fv_inner_top02 .fv_looplogo{
margin: 0 0 10px;
}

img.fv_looplogo_images{
}

.fv_looplogo img.fv_looplogo_images:first-child{
}

.fv_looplogo img.fv_looplogo_images:last-child{
}

.fv_inner_top section.search_step{
width: calc(100% - 20px);
margin: 0 auto 20px;
}

.fv_top_menu{
padding: 0 10px;
}

a.fv_top_menu_item{
font-size: 10px;
flex-basis: calc(50% - 5px);
padding: 12px 25px 12px 0;
border: solid 1px #e5e5e5;
border-radius: 4px;
}

a.fv_top_menu_item:after{
width: 18px;
height: 18px;
background-repeat: no-repeat;
}

a.fv_top_menu_item:nth-child(odd){
margin: 0 5px 10px 0;
}

a.fv_top_menu_item:nth-child(even){
margin: 0 0 10px 5px;
}

a.fv_top_menu_item:nth-child(odd):nth-last-child(2),.fv_top_menu_item:nth-child(even):last-child,.fv_top_menu_item:nth-child(odd):last-child{
margin-bottom: 0;
}


a.fv_top_menu_item span.__title{
font-size: 18px;
}

a.fv_top_menu_item.__column1{
margin: 0;
}

a.fv_top_menu_item.__column1:after{
}

.fv_top_menu02{
padding: 0 10px;
margin: 0 0 0;
}

a.fv_top_menu02_item{
font-size: 10px;
flex-basis: calc(50% - 5px);
border: solid 1px #4fa2c0;
padding: 10px;
border-radius: 0px;
box-shadow: 1px 2px 0 #4fa2c0;
}

a.fv_top_menu02_item:after{
width: 22px;
height: 6px;
bottom: 5px;
right: 5px;
}

a.fv_top_menu02_item.__border_gray:after{
}

a.fv_top_menu02_item.__border_gray{
border: solid 1px #9A938A;
box-shadow: 1px 2px 0 #9A938A;
}

a.fv_top_menu02_item:nth-child(odd){
margin: 0 5px 10px 0;
}

a.fv_top_menu02_item:nth-child(even){
margin: 0 0 10px 5px;
}

a.fv_top_menu02_item:nth-child(odd):nth-last-child(2),.fv_top_menu02_item:nth-child(even):last-child,.fv_top_menu02_item:nth-child(odd):last-child{
margin-bottom: 0;
}


a.fv_top_menu02_item span.__title{
font-size: 18px;
}

a.fv_top_menu02_item span.__color01{

}

a.fv_top_menu02_item span.__color02{

}

a.fv_top_menu02_item span.__color03{

}

a.fv_top_menu02_item span.__color04{

}

a.fv_top_menu02_item span.__color05{

}

a.fv_top_menu02_item span.__color06{

}


.fv_pr{
font-size: 10px;
right: 5px;
top: 5px;
padding: 5px 5px 3px;
border: solid 1px var(--blue002);
border-radius: 4px;
}

.fv_inner_student .fv_pr{
border: solid 1px #FE843C;
}

.fv_inner_top .fv_pr{
top: 32.8vw;
background: #fff;
}

.fv_inner_lp .fv_pr{
top: 36.5vw;
}

ul.fv_tags{
padding: 0 10px;
margin: 20px 0 -5px;
}

ul.fv_tags li{
padding: 5px 8px;
border-radius: 6px;
margin: 0 5px 5px 0;
font-size: 14px;
}

ul.fv_tags li:before{
content: '#';
margin: 0 4px 0 0;
}

.fv_inner_student{
text-align: center;
}

.fv_inner_student img.fv_agent_button{
width: calc(100% - 20px);
}


.fv_anchor02_wrap{
margin: 20px 0 0;
padding: 0 6px;
}

a.fv_anchor02_item{
flex-basis:calc(50% - 4px);
font-size: 13px;
background: linear-gradient(to left, #17467b 0%, #17467b 20px, var(--blue000) 20px, var(--blue000) 100%);
padding: 8px 28px 8px 8px;
border-radius: 6px;
box-shadow: 0px 2px 4px rgb(0 0 0 / 30%);
}

a.fv_anchor02_item:after{
font-size: 11px;
right: 4px;
}

.fv_anchor02_wrap a.fv_anchor02_item:nth-child(odd){
margin: 0 4px 0 0;
}

.fv_anchor02_wrap a.fv_anchor02_item:nth-child(even){
margin: 0 0 0 4px;
}

.fv_anchor02_wrap a.fv_anchor02_item:not(:first-child,:nth-child(2)){
margin-top: 8px;
}

a.fv_anchor02_item span.__title{
margin: 0 0 8px;
}

a.fv_anchor02_item span.__title:after{
    font-size: 10px;
    margin: 0 0 0 5px;
vertical-align: -1px;
}

a.fv_anchor02_item ul.__list{
font-size: 10px;
padding: 6px 4px 6px 18px;
border-radius: 4px;
}

a.fv_anchor02_item ul.__list li{
margin: 0 0 4px;
}

a.fv_anchor02_item ul.__list li:before{
    left: -13px;
}

a.fv_anchor02_item ul.__list li:last-child{
margin-bottom: 0;
}

.fv_notice{
    margin: 10px auto 0px;
    width: calc(100% - 10px);
    padding: 10px;
    border: solid 3px #00a8a8;
    border-radius: 0px;
    box-shadow: 0px 1px 2px rgb(0 0 0 / 30%);
    background-image: linear-gradient(0deg, transparent calc(100% - 1px), #f0f0f0 calc(100% - 1px)),
                    linear-gradient(90deg, transparent calc(100% - 1px), #f0f0f0 calc(100% - 1px));
    background-size: 8px 8px;
}

.fv_notice.__rt{
border: solid 3px #9597c7;
}

.fv_notice.__mt{
border: solid 3px #5f98f9;
}

.compare_lp_tablewrap table.compare_table.__table_haken th:nth-child(1){
width: 26%;
}

.compare_lp_tablewrap table.compare_table.__table_haken th:nth-child(2) ,.compare_lp_tablewrap table.compare_table.__table_haken th:nth-child(3), .compare_lp_tablewrap table.compare_table.__table_haken th:nth-child(4) {
    width: calc((100% - 22%) / 4);
}

.compare_lp_tablewrap table.compare_table.__table_haken tr td:nth-child(1){
padding: 6px;
}

.compare_lp_tablewrap table.compare_table.__table_haken.__table_driver tr td:nth-child(1){
padding: 18px 6px;
}


table.compare_table.__table_haken img.compare_table_logo {
}

p.compare_table_feature_text{
font-size: 10px;
}

table.compare_table.__table_haken a.compare_table_textlink:after{
}

.orangeline {
}

p.add_amount {
    padding-top: 15px;
    font-size: 10px;
    transform: scale(100%);
}

p.add_amount::after {
    font-size: 20px;
    top: -5px;
}

p.add_amount u {
    text-decoration: none;
}

img.add_crown{
width: clamp(1rem, 5.35vw, 2.3rem);
}

img.compare_ev_icon {
    width: 22px;
}

.compare_amount_text {
  font-size: 10px;
  padding: 4px;
  border-radius: 2px;
  margin-top: 8px;
}

.compare_amount_text::after {
  top: -8px; /* 吹き出し本体の下端から下に配置 */
  border-width: 0 4px 8px 4px;
}

table.compare_table.__table_haken td.__td_amount {
padding: 4px 0;
}

.compare_tab_wrap {
  margin:10px 0 0;
  padding: 0 5px;
}

.tab_compare_label {
  padding: 10px 0;
  border-radius: 8px;
  font-size: 18px;
}

.tab_compare_label span.__small{
}

.tab_compare_label:not(:last-of-type) {
  margin-right: 8px;
}
.tab_compare_content {
}
/* アクティブなタブ */
.tab_compare_switch:checked+.tab_compare_label {
}

.tab_compare_switch:checked+.tab_compare_label:nth-of-type(2) {
  
}

.tab_compare_switch:checked+.tab_compare_label+.tab_compare_content {
gap: 16px;
padding: 16px 0px 0px;
border-radius: 0 ;

}
/* ラジオボタン非表示 */
.tab_compare_switch {
}

.tab_compare_content{
}

.tab_compare_switch:checked+.tab_compare_label+.tab_compare_content.tab_compare_2{

}

.compare_tab_baloon{

}

.compare_tab_baloon:before,.compare_tab_baloon:after{

}

.compare_occupation__title{
font-size: 16px;
}

.compare_occupation__title span.__strong{
padding: 6px 8px;
margin: 0 4px;
border-radius: 6px;
}

.compare_occupation dl dt{
padding: 6px;
font-size: 12px;
}

.compare_occupation dl dt span.__strong{
}

.compare_occupation dl dd{
padding: 8px;
font-size: 12px;
}

.compare_occupation dl dd ul{
gap: 6px 0;
}

.compare_occupation dl dd ul li{
gap: 4px;
font-size: 11px;
}

.compare_occupation dl dd ul li:before{
}

img.compare_arrow_image{
width: 40px;
}

.compare_tab_title{
font-size: 16px;
width: calc(100% - 32px);
background: linear-gradient(transparent 48%, #28B6D6 49%, #28B6D6 52%, transparent 52%);
}

span.__lightgray{
padding: 0 4px;
}



/*sample
----------------------------------------------------------------------*/

section.sample{
padding: 0 10px;
margin: 0 0 40px;
}

h2.sample_h2{
  height: 30px;
  padding: 5px 0px;
  font-size: 20px;
  margin: 0 0 10px;
}

h2.sample_h2:before,h2.sample_h2:after{
  position: absolute;
  content: '';
  width: 0px;
  height: 0px;
  z-index: 1;
}

h2.sample_h2:before{
  top: 0;
  left: 0;
  border-width: 15px 0px 15px 8px;
}

h2.sample_h2:after{
top: 0;
right: 0;
  border-width: 15px 8px 15px 0px;
}


ul.sample_item_wrap{
    padding: 0 0 10px;
}

li.sample_item{
    margin: 0 6px 0 0px;
    width: 180px;
    border-radius: 6px;
	padding: 0 0 52px;
}

h3.sample_item_h3{
padding: 10px;
border-radius: 6px 6px 0 0;
font-size: 14px;
}

img.sample_item_image{
margin: 0 0 5px;
}

.sample_item_label-workform{
font-size: 10px;
padding: 5px 10px;
margin: 0 0 5px;
}

ul.sample_item_spec{
width: calc(100% - 20px);
}

ul.sample_item_spec li{
border-bottom: dotted 2px #ccc;
padding: 3px 0px;
}

ul.sample_item_spec li.sample_item_spec_salary{
font-size: 14px;
}

ul.sample_item_spec li.sample_item_spec_salary span.color01{
}

a.sample_item_linkbutton{
box-shadow: 0 3px 0 #B62400;
padding: 10px;
border-radius: 6px;
bottom: 12px;
}

p.sample_addition{
font-size: 12px;
}

section.sample.sample_highclass h3.sample_item_h3{
}

section.sample.sample_highclass .sample_item_label-workform{

}

section.sample.sample_highclass a.sample_item_linkbutton{
box-shadow: 0 3px 0 #600D16;
padding: 10px 15px;
}

/*pickup
----------------------------------------------------------------------*/

section.pickup{
padding: 0px 10px;
margin: 0 0 40px;
}


h2.pickup_h2,h2.compare_h2,h2.merit_h2,h2.qanda_h2{
display: block;
width: 100%;
position: relative;
height: 30px;
padding: 5px 0px;
font-size: 18px;
margin: 0 auto 10px;
}

h2.pickup_h2:before,h2.pickup_h2:after,h2.compare_h2:before,h2.compare_h2:after,h2.merit_h2:before,h2.merit_h2:after,h2.qanda_h2:before,h2.qanda_h2:after{
position: absolute;
    content: '';
    width: 0px;
    height: 0px;
    z-index: 1;
}

h2.pickup_h2:before,h2.compare_h2:before,h2.merit_h2:before,h2.qanda_h2:before{
    top: 0;
    left: 0;
    border-width: 15px 0px 15px 7px;

}

h2.pickup_h2:after,h2.compare_h2:after,h2.merit_h2:after,h2.qanda_h2:after{
    top: 0;
    right: 0;
    border-width: 15px 7px 15px 0px;

}

.pickup_item{
padding: 10px;
border-radius: 6px;
box-shadow: 0px 1px 2px rgb(0 0 0 / 30%);
}

a.pickup_item_banner_wrap{
margin: 0 10px 0 0;
}

IMG.pickup_item_banner{
width: 150px;
}

a.pickup_item_servicename{
font-size: 18px;
margin: 0 0 5px;
}

.pickup_item_value{
margin: 0 0 5px;
}

.pickup_item_value .__label{
padding: 2px 2px 4px;
font-size: 12px;
margin: 0 5px 0 0;
}

.pickup_item_value span.__score{
}

.pickup_item_value .__star{
white-space: nowrap;
}

p.pickup_item_description{
font-size: 12px;
margin: 0 0 5px;
font-weight: bold;
}

a.pickup_item_linkbutton{
font-size: 12px;
box-shadow: 0 3px 0 #B62400;
padding: 5px 0;
}


h3.pickup_area_h3{
padding: 10px 10px 11px;
margin: 0 0 8px;
font-size: 16px;
border-radius: 6px;
}

h3.pickup_area_h3:after{
    bottom: -8px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    border-style: solid;
    border-color: var(--pink002) transparent transparent transparent;
    border-width: 15px 10px 0 10px;
    z-index: 1;
}

span.__white{
line-height: 1;
padding: 0 3px 0px;
margin: 0 5px 0 5px;
font-size: 14px;
}

.pickup_item_spec_wrap{
margin: 0 0 5px;
}

.pickup_item_spec{
font-size: 10px;
}

.pickup_item_spec_wrap .pickup_item_spec:first-child{
margin: 0 10px 0 0;
}

.pickup_item_spec_wrap .pickup_item_spec:first-child:after{
right: -8px;
font-size: 12px;
}

.pickup_item_spec .__label{
font-size: 10px;
padding: 2px 2px 2px;
border: solid 1px var(--blue002);
border-radius: 3px;
}

.pickup_item_spec .__contents{
line-height: 1;
}

.pickup_h2_baloon{
padding: 8px 8px 10px;
border-radius: 6px;
margin: 0 0 8px;
}

.pickup_h2_baloon:after{
    bottom: -8px;
    border-color: #333 transparent transparent transparent;
    border-width: 8px 5px 0 5px;
}

/*compare
----------------------------------------------------------------------*/


#compare{
font-size: 12px;
padding: 0 5px;
margin-bottom: 30px;
}

#compare .inner{
padding: 0px 10px 10px;
background: #fff;
}

#compare .tab-wrap{
margin-top: 0px;
box-shadow:0px 2px 4px #ccc
}

#compare .tab-label{
font-size: 14px;
}

#compare .tab-switch:checked+.tab-label+.tab-content{
padding: 5px;
}

#compare .tab-switch:checked+.tab-label+.tab-content.tab2{
padding: 20px;
}

.tablesorter-default{
font-size: 10px;
}


table.compare_table{
font-size: 12px;
}

table.compare_table th,table.compare_table td{
}

table.compare_table th{
font-size: 12px;
padding: 4px 0 2px;
}

table.compare_table td{
text-align: center;
padding: 5px 5px;
}

table.compare_table tr:nth-child(2) td:nth-child(1){
padding: 18px 5px 5px;
}

table.compare_table th:nth-child(2),table.compare_table th:nth-child(3),table.compare_table th:nth-child(4){
width: calc((100vw - 160px) / 3);
}

table.compare_table td.ev01{
background: url(../images/hoiku_compare_icon01.png);
}

table.compare_table td.ev02{
background: url(../images/hoiku_compare_icon02.png);
}

table.compare_table td.ev03{
background: url(../images/hoiku_compare_icon03.png);
}

table.compare_table td.ev01,table.compare_table td.ev02,table.compare_table td.ev03{
background-repeat: no-repeat;
background-size: 50px;
background-position: center;
background-color:rgba(255,255,255,0.5);
background-blend-mode:lighten;
text-shadow: 1px 1px 0 #fff,1px 0px 0 #fff,0px 1px 0 #fff,0px -1px 0 #fff,-1px 0px 0 #fff,-1px 1px 0 #fff,1px -1px 0 #fff,-1px -1px 0 #fff;
}


table.compare_table th:nth-child(1){
width: 150px;
}

img.compare_table_logo{
width: 120px;
}

a.compare_table_logo_wrap{
display: inline-block;
}

a.compare_table_linkbutton{
padding: 5px 0px;
border-radius: 6px;
width: 120px;
margin: 0 auto 3px;
font-size: 10px;
box-shadow: 0 3px 0 #B62400;
}

a.compare_table_textlink{
font-size: 10px;
}

a.compare_table_textlink:after{
    font-size: 10px;
    margin: 0 0 0 2px;
}

.compare_table_score{
font-size: 16px;

}

.compare_table_score i{
vertical-align: 2px;
}

a.compare_table_review{
margin: 2px 0 0;
font-size: 10px;
}

span.compare_table_review_span{
}


a.compare_table_review:before{
  font-family: "Font Awesome 5 Free";
  content: "\f4ad";
  font-weight: 900;
  margin: 0 2px 0 0;
}

span.compare_table_amount_span{
font-size: 14px;
font-weight: bold;
color: #222;
}

span.compare_table_area_span{
font-size: 12px;
font-weight: bold;
color: #222;
}

span.compare_table_age_span{
  font-size: 12px;
}


.compare_table_td_label_wrap{
left: 0;
}

.compare_table_td_label{
font-size: 10px;
height: 20px;
line-height: 1;
padding: 2px 0px 4px 5px;
background: #CAA846;
text-shadow: 0 -1px 0 #B58B11;
font-weight: bold;
}

.compare_table_td_label i{
font-size: 10px;
vertical-align: 0px;
color: #DEC784;
}

.compare_table_td_label:after{
position: absolute;
content: '';
top: 0;
right: -9px;
border-width: 20px 9px 0 0;
border-color: #CAA846 transparent transparent transparent;
}

p.compare_table_addition{
margin: 5px 0 0;
font-size: 10px;
color: #888;
}


#compare #recommend .recommend-box{
padding: 20px;
margin-bottom: 20px;
}

#compare #recommend .row{
margin: 0;
}

#compare #recommend .row:last-child .recommend-box:last-child{
margin: 0;
}

#compare #recommend .recommend-box .title{
font-size: 20px;
margin: 0 0 10px;
}

#compare #recommend .recommend-box .title:before{
width: 12px;
height: 18px;
}

#compare #recommend .recommend-box .logo{
width: 160px;
}

#compare #recommend .recommend-box p{
font-size: 14px;
}

#compare #recommend .recommend-box a.txtlink{
font-size: 16px;
}

.compare_lp_tablewrap{

}

h2.compare_lp_h2{
font-size: 16px;
border-radius: 6px 6px 0 0 ;
padding: 15px 0;
}

h2.compare_lp_h2 span.__orange{
}

p.compare_table_copy{
padding: 5px;
font-size: 11px;
box-shadow: 0px 1px 2px rgb(0 0 0 / 20%);
}

p.compare_table_copy:before,p.compare_table_copy:after{
    left: -1px;
    top: -1px;
}

p.compare_table_copy:before{
border-right: 8px solid transparent;
border-top: 8px solid #fff;
z-index: 2;
}

p.compare_table_copy:after{
border-bottom: 8px solid var(--red002);
border-left: 8px solid transparent;
}

p.compare_table_copy span.__inlineblock{
}

a.compare_table_linkbutton02{
font-size: 11px;
box-shadow: 0px 3px 0px #B62400;
padding: 5px 0;
border-radius: 6px;
}

a.compare_table_linkbutton02:after{
  width: 15px;
}

 .compare_lp_tablewrap a.compare_table_textlink{
 margin: 0 0 5px;
 
 }

.compare_lp_tablewrap table.compare_table tr td:nth-child(1){
padding: 10px 5px;
}

.compare_lp_tablewrap table.compare_table th,.compare_lp_tablewrap table.compare_table td{
}

.compare_lp_tablewrap table.compare_table th{
}

.compare_lp_tablewrap table.compare_table td.ev01,.compare_lp_tablewrap table.compare_table td.ev02,.compare_lp_tablewrap table.compare_table td.ev03{
font-size: 10px;
padding: 5px 0;
}

p.comparison_table_notice{
margin: 5px 0 0;
font-size: 10px;
}

.compare_lp_tablewrap table.compare_table th:nth-child(2),.compare_lp_tablewrap table.compare_table th:nth-child(3),.compare_lp_tablewrap table.compare_table th:nth-child(4){
width: calc((100vw - 150px) / 3);
}



ul.compare_occupation_list{
padding: 0 0 0 12px;
}

ul.compare_occupation_list li{
margin: 0 0 6px;
font-size: 10px;
}

ul.compare_occupation_list li:last-child{
margin: 0;
}


ul.compare_occupation_list li:before{
width: 14px;
height: 10px;
left: -16px;
}

ul.compare_occupation_list li.__occupation01:before{
}

ul.compare_occupation_list li.__occupation02:before{
}

ul.compare_occupation_list li.__occupation03:before{
}

ul.compare_occupation_list li.__occupation04:before{
}

ul.compare_occupation_list li.__occupation05:before{
}

.compare_lp_tablewrap.compare_build_tablewrap img.compare_table_logo{
width: 120px;
}

.compare_lp_tablewrap.compare_build_tablewrap table.compare_table th:nth-child(1){
width: 150px;
}

.compare_lp_tablewrap.compare_build_tablewrap a.compare_table_textlink:after{
display: none;
}


/*reason
----------------------------------------------------------------------*/

section.reason{
padding: 0 10px;
margin: 0 0 40px;
}

img.reason_image{

}


/*ranking
----------------------------------------------------------------------*/

section.ranking{
margin: 0 0 40px;
}


h2.ranking_h2{
padding: 10px 0;
margin: 0 0 10px;
font-size: 20px;
}

h2.ranking_h2 span.__small{
font-size: 14px;
}

h2.ranking_h2:before,h2.ranking_h2:after{
position: absolute;
display: inline-block;
content: '';
background-size: contain;
width: 21px;
height: 48px;
}

h2.ranking_h2:before{
background-image: url(../images/aga_ranking_h2_icon01.png);
left: 5px;
bottom: 10px;
}

h2.ranking_h2:after{
background-image: url(../images/aga_ranking_h2_icon02.png);
right: 5px;
bottom: 10px;
}

.ranking_inner{
padding: 0 10px;
}

.ranking_item{
padding: 10px;
border-radius: 6px;
margin: 0 0 15px;
box-shadow: 0px 1px 2px rgb(0 0 0 / 30%);
}

.ranking_item_maincopy{
font-size: 16px;
margin: 0 0 10px;
}

.ranking_item_header{
padding: 0 0 15px 41px;
border-bottom: solid 1px #ccc;
margin: 0 0 10px;
}

.ranking_item_header_rank{
height: 42px;
width: 36px;
font-size: 20px;
}

.ranking_item_header_rank.rank02{

}

.ranking_item_header_rank.rank03{

}

.ranking_item_header_rank.rank04,.ranking_item_header_rank.rank05{

}


h3.ranking_item_header_h3{
font-size: 22px;
width: 100%;
margin: 0 0 10px;
}

.ranking_item_header_star{
font-size: 14px;
}

.ranking_item_header_star span.__pt{
font-size: 10px;
padding: 3px 5px 4px;
margin: 0 4px 0 0;
border-radius: 4px;
vertical-align: 2px;
}


 .ranking_item_header_star span.__score{
font-size: 18px;
 }

.ranking_item_spec01{
margin: 0 0 10px;
}

a.ranking_item_banner_wrap{
margin: 0 10px 0 0;
}

img.ranking_item_banner{
width: 150px;
}

table.ranking_item_spec01_table,table.ranking_item_spec02_table{
font-size: 12px;
}

table.ranking_item_spec01_table th,table.ranking_item_spec01_table td,table.ranking_item_spec02_table th,table.ranking_item_spec02_table td{

}

table.ranking_item_spec01_table th,table.ranking_item_spec02_table th{
padding: 5px 0;
}

table.ranking_item_spec01_table td,table.ranking_item_spec02_table td{
padding: 8px 8px;
font-weight: bold;
}

table.ranking_item_spec02_table{
margin: 0 0 10px;
}

table.ranking_item_spec02_table th{
}

table.ranking_item_spec02_table span.__small{
font-size: 10px;
}

.ranking_item_spec01_table span.__label_kangoshi:before,.ranking_item_spec01_table span.__label_junkangoshi:before,.ranking_item_spec01_table span.__label_zyosanshi:before,.ranking_item_spec01_table span.__label_hokenshi:before{
width: 16px;
height: 12px;
transform: translateY(2px);
margin: 0 2px 0 0;
}

ul.ranking_item_spec02_tags li{
flex-basis: calc((100% - 15px) / 4 );
    padding: 4px 5px 5px;
    margin: 0 0 5px;
    font-size: 12px;
}

ul.ranking_item_table_ocupationlist{
}

ul.ranking_item_table_ocupationlist li{
font-size: 14px;
padding: 4px 10px;
margin: 0 4px 4px 0;
}

ul.ranking_item_table_ocupationlist li:last-child{
padding: 4px 0;
font-size: 12px;

}

.ranking_item_point_box{
padding: 30px 10px 10px;
margin: 0 0 10px;
}

.ranking_item_point_h4_wrap{

}

h4.ranking_item_point_h4{
    padding: 5px 0px 6px 8px;
    height: 25px;
    font-size: 14px;
}

h4.ranking_item_point_h4:after{
    content: '';
    position: absolute;
    top: 0;
    right: -16px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 25px 16px 0 0;

}

ul.ranking_item_point_list{
padding: 10px 10px 10px 26px;
margin: 0 0 10px;
}

ul.ranking_item_point_list li{
margin: 0 0 5px;
}

ul.ranking_item_point_list li:after{
left: -20px;
top: 2px;
}

p.ranking_item_point_description{
    padding-bottom: 4px;
	font-size: 12px;
}

p.ranking_item_point_description span.__red{
}

.ranking_item_microcopy{
margin: 0 0 5px;
}

.ranking_item_microcopy:after,.ranking_item_microcopy:before{
background-size: cover;
width: 8px;
height: 16px;
right: -15px;
bottom: 0;
}

.ranking_item_microcopy:before{
left: -15px;
right: auto;
bottom: 0;
}

.center{

}

a.ranking_item_linkbutton{
    font-size: 16px;
    box-shadow: 0 4px 0 #B62400;
    border-radius: 6px;
    padding: 15px 0;
    margin: 0 auto 4px;
}

p.ranking_item_addition{
margin: 14px 0 0 ;
font-size: 11px;
}

p.ranking_item_baloon{
border: solid 1px #fd9426;
width: calc(100% - 20px);
margin: 0 auto 10px;
font-size: 12px;
padding: 10px;
border-radius: 6px;
}

p.ranking_item_baloon:before{
  border: 4px solid transparent;
  border-top: 7px solid #fff6ed;
}

p.ranking_item_baloon:after{
  border: 5px solid transparent;
  border-top: 8px solid #fd9426;
}

p.ranking_item_baloon span.__red{
}


h4.ranking_item_uservoice_h4{
padding: 8px 8px;
font-size: 14px;
border-radius: 0 10px 0 0;
}

.ranking_item_uservoice{
margin: 0 0 10px;
}

h4.ranking_item_uservoice_h4:before{
margin: 0 5px 0 0;
}

h4.ranking_item_uservoice_h4 span.__notice{
font-size: 12px;
}

p.ranking_item_uservoice_description{
padding: 10px;
font-size: 12px;
}

li.ranking_item_review{
}

ul.ranking_item_review__wrap li.ranking_item_review:not(:last-child){
margin: 0 0 10px;
padding: 0 0 10px;
}

ul.ranking_item_review__wrap li.ranking_item_review:not(:last-child):after{
height: 1px;
}

.ranking_item_review__profile{
padding: 0 0 0 42px;
position: relative;
font-size: 14px;
}

.ranking_item_review__profile:before{
width: 32px;
height: 32px;
background: url(../images/20s_ranking_item_review-icon.png);
left: 0;
background-repeat: no-repeat;
background-size: contain;
}

.ranking_item_review__profile.male:before{
width: 32px;
height: 32px;
background: url(../images/20s_ranking_item_review-icon_male.png);
left: 0;
background-repeat: no-repeat;
background-size: contain;
}

.ranking_item_review__profile_title{
padding: 10px 0 10px;
}

.ranking_item_review__profile_detail{

}

._detail_star{
margin: 0 10px 0 0;
}

span._detail_star_gold{
color: #ffcc00;
}

span._detail_star_gray{
color: #ccc;
}

._detail_age-occuaption{
font-size: 12px;
}

p.ranking_item_review__description{
font-size: 12px;
}

.ranking_item_review__box{
margin: 0 0 10px;
}

.grad-btn {
  z-index: 2;
    position: absolute;
    right: 0;
    bottom: 10px;
    left: 0;
    width: 100px;
    margin: auto;
    padding: 5px 0;
    border-radius: 4px;
    background: #fe9c3c;
    color: #fff;
    font-size: 12px;
    text-align: center;
    cursor: pointer;
    transition: .2s ease;
    box-shadow: 0 0 3px rgb(0 0 0 / 30%);
	font-weight: bold;
}

ul.ranking_item_review__wrap{
padding: 10px;
  position: relative;
  overflow: hidden;
  height: 120px;
}

ul.ranking_item_review__wrap::before {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 60px; /*グラデーションで隠す高さ*/
  background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0.9) 50%, #fff 100%);
  background: linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0.9) 50%, #fff 100%);
  content: "";
  z-index: 1;
}
.grad-trigger {
  display: none; /*チェックボックスは常に非表示*/
}
.grad-trigger:checked + .grad-btn {
  display: none; /*チェックされていたら、grad-btnを非表示にする*/
}
.grad-trigger:checked ~ ul.ranking_item_review__wrap{
  height: auto; /*チェックされていたら、高さを戻す*/
}
.grad-trigger:checked ~ ul.ranking_item_review__wrap::before {
  display: none; /*チェックされていたら、grad-itemのbeforeを非表示にする*/
}


h4.ranking_item_comment_h4{
padding: 8px 8px;
font-size: 14px;
border-radius: 0 10px 0 0;
}

.ranking_item_comment{
margin: 0 0 10px;
}

h4.ranking_item_comment_h4:before{
margin: 0 5px 0 0;
}

p.ranking_item_comment_description{
padding: 0px;
font-size: 14px;
}

p.ranking_item_comment_description span.__color01{
color: var(--red001);
}

.ranking_item_user_list_h4{
font-size: 16px;
margin: 0 0 4px;
}

.ranking_item_user_list_h4:before{
margin: 0 0 0 0;
width: 30px;
height: 30px;
vertical-align: -5px;
}

ul.ranking_item_user_list{
padding: 10px;
border: solid 1px #ccc;
margin: 0 0 10px;
box-shadow: 0px 2px 4px rgb(0 0 0 / 15%);
border-radius: 3px;
}

ul.ranking_item_user_list li{
padding: 4px 0 4px 18px;

}

ul.ranking_item_user_list li:not(:last-child){
border-bottom: solid 1px #ccc;
}

ul.ranking_item_user_list li:before{
}

.ranking_item_comment_inner{
padding: 10px;
}

h5.ranking_item_comment_h5{
font-size: 14px;
padding: 0 0 0 28px;
margin: 0 0 5px;
}

h5.ranking_item_comment_h5:before{
width: 24px;
height: 24px;
}

.ranking_item_comment_inner p.ranking_item_comment_description:not(:last-child){
margin: 0 0 10px;
}

p.ranking_item_notice{
margin: 10px 0 0;
font-size: 10px;
}

p.ranking_item_pr{
font-size: 12px;
margin: 0 0 10px;
}

.ranking_h2_02_wrap{
padding: 35px 0 20px;
margin: 0 0 10px;
border-radius: 0px;
}

.ranking_h2_02_wrap:before{
}

.ranking_h2_02_wrap:after{
height: 12px;
border-bottom: solid 2px #fff;
}


h2.ranking_h2_02{
font-size: 24px;
text-shadow: 0px 2px 0px rgb(0 0 0 / 20%);
}

.ranking_h2_02_subtitle{
font-size: 16px;
text-shadow: 0px 2px 0px rgb(0 0 0 / 20%);
}

.ranking_h2_02_subtitle span.__underline{
border-bottom: solid 2px #fff;
}

.ranking_h2_02_date{
width: 40px;
height: 60px;
left: 10px;
font-size: 10px;
padding: 20px 0 0;
}

.ranking_h2_02_date span.__month{
}


.ranking_inner.ranking_inner_engineer{
padding: 0 0px;
}

.ranking_tab_wrap {
  margin:10px 0 0;
}

.tab_ranking_label {
  padding: 5px .5em;
  border-radius: 3px 3px 0 0;
}

.tab_ranking_label span.__small{
font-size: 10px;
}

.tab_ranking_label:not(:last-of-type) {
  margin-right: 3px;
}
.tab_ranking_content {
}
/* アクティブなタブ */
.tab_ranking_switch:checked+.tab_ranking_label {
}

.tab_ranking_switch:checked+.tab_ranking_label:nth-of-type(2) {
}

.tab_ranking_switch:checked+.tab_ranking_label+.tab_ranking_content {
  padding: 10px;
border-radius: 0 0 6px 6px;
border-top: solid 4px #4B96EF;
}
/* ラジオボタン非表示 */
.tab_ranking_switch {
}

.tab_ranking_content{

}

.tab_ranking_switch:checked+.tab_ranking_label+.tab_ranking_content.tab_ranking_2{
border-top: solid 4px #D35A78;
}

.ranking_tab_baloon{
}

.ranking_tab_baloon:before,.ranking_tab_baloon:after{
height: 1.1rem;
}

.ranking_tab_baloon:before{
border-left: solid 2px #888;
left: -10px;
}

.ranking_tab_baloon:after{
border-right: solid 2px #888;
right: -10px;
}

.tab_ranking_content .ranking_item{
border: solid 1px #ccc;
}

ul.__engineer_occupation_list{
font-size: 10px;
padding: 12px 8px 8px;
background: var(--blue004);
margin: 0 0 10px;
}

ul.__engineer_occupation_list li:after{
}

ul.__engineer_occupation_list li:last-child:after{
}


table.ranking_item_spec02_table td ul.__engineer_occupation_list:last-child{
margin: 0;
}

.__engineer_occupation_label{
font-size: 12px;
top: -8px;
}

.tab_ranking_content table.ranking_item_spec02_table td {
    padding: 12px 8px 8px;

}


/*menu
----------------------------------------------------------------------*/

section.menu{
padding: 0 10px;
margin: 0 0 40px;
}

h2.menu_h2{
    font-size: 20px;
    margin: 0 0 14px;
}

h2.menu_h2:after{
    bottom: -5px;
    width: 40px;
    height: 4px;
}

.menu_area_wrap{
    border-radius: 6px;
    padding: 15px;
    margin: 0 0 30px;
}

.menu_area_row{
margin: 0 0 10px;
}

.menu_area_rural{
    width: 20%;
    font-size: 14px;
}

ul.menu_area_prefecture{
    width: 80%;
}

ul.menu_area_prefecture li{
    width: 22%;
    margin: 0 3px 5px;
}

ul.menu_area_prefecture li a{
    padding: 6px 0px;
    border-radius: 4px;
    background: #fbe7e9;
    font-size: 12px;
    font-weight: bold;
}

.menu_category_wrap{
}

a.menu_category_item{
flex-basis: calc(50% - 5px);
padding: 15px;
border-left: solid 2px var(--blue002);
margin: 0 0 10px;
font-size: 12px;
line-height: 1.5;
}

a.menu_category_item:after{
    right: 5px;
}

a.menu_category_item span.__color01{
font-size: 16px;
color: var(--blue002);
}

a.menu_category_item.__agent{
border-left: solid 2px #fe9a37;
}

a.menu_category_item.__agent span.__color01{
font-size: 16px;
color: #fe9a37;
}

a.menu_category_item.__agent:after{

}

/*result
----------------------------------------------------------------------*/

section.result{
padding: 10px 10px 0;
}

.result_header01{
padding: 0 ;
margin: 0 0 10px;
}

.result_header01_counter{
font-size: 16px;
}

.result_header01_change-button{
padding: 10px 5px;
font-size: 14px;
border: solid 1px #ccc;
border-radius: 6px;
}


.result_header02_wrap{

}

.result_header02{
margin: 0 0 10px;
padding: 10px;
border-radius: 6px;
}

h3.result_header02_h3{
font-size: 14px;
margin: 0 0 10px;
}

ul.result_header02_settings_wrap{
}

ul.result_header02_settings_wrap li{
font-size: 12px;
border: solid 1px var(--blue001);
padding: 5px 5px 5px 15px;
margin: 0 5px 5px 0;
}

.result_header02_pr{
font-size: 12px;
padding: 4px 6px;
border-radius: 4px;
top: 10px;
right: 10px;
}


#submit_select{
    font-size: 14px;
    width: 180px;
    height: 36px;
    line-height: 30px;
	border-radius: 6px;
	margin: 0 0 10px auto;
}

section.notice_result{
padding: 10px 0px;
margin: 0 auto 10px;
width: calc(100vw - 20px);
border-radius: 5px;
border: solid 1px #ff7e0e;
}

h3.notice_result_title{
font-size: 12px;
}

h3.notice_result_title:before{
margin: 0 3px 0 0;
}

p.notice_result_description{
font-size: 12px;
}

section.notice_result.result_none{

}

section.notice_result.result_none h3.notice_result_title:before{

}


.result_item{
padding: 10px;
border-radius: 6px;
margin: 0 0 10px;
margin: 0 0 20px;
}

ul.result_item_tags{
margin: 0 0 5px;
}

ul.result_item_tags li{
font-size: 11px;
margin: 0 4px 4px 0;
padding: 3px 3px 3px;
border-radius: 3px;
}

ul.result_item_tags li sup{
}

ul.result_item_tags li.__gold{
}

ul.result_item_tags li.__gold i{
margin: 0 3px 0 0;
font-size: 10px;
}

.result_item_header{
margin: 0 0 10px;
}

a.result_item_name{
font-size: 18px;
margin: 0 0 5px;
}

.result_item_spec01{

}

a.result_item_banner_wrap{
margin: 0 10px 0 0;
}

img.result_item_banner{
width: 125px;
}

table.result_spec01_table{
font-size: 12px;
}

table.result_spec01_table tr{
border-bottom: dotted 2px #ccc;
}

table.result_spec01_table th{
width: 65px;
padding: 8px 0px;
}

table.result_spec01_table td{
font-weight: bold;
}

table.result_spec01_table span.__label_hoikushi:before,table.result_spec01_table span.__label_yochien:before{
width: 16px;
height: 12px;
margin: 0 2px 0 0;
transform: translateY(2px);
}


.result_item_spec01_tdinner{
}

td.result_item_spec01_table_ocupation{
white-space: nowrap;
padding: 10px 0;
}

td .result_item_spec01_tdinner:first-child{
margin: 0 5px 0 0;
}

.result_spec01_table span.__label_kangoshi:before,.result_spec01_table span.__label_junkangoshi:before,.result_spec01_table span.__label_zyosanshi:before,.result_spec01_table span.__label_hokenshi:before{
width: 16px;
height: 12px;
margin: 0 3px 0 0;
    top: 50%;
    transform: translateY(3px);
}
.result_spec01_table span.__label_junkangoshi:before{
}

.result_spec01_table span.__label_zyosanshi:before{
}

.result_spec01_table span.__label_hokenshi:before{
}



table.result_spec01_table span.__label_yochien:before{
}

.result_item_point_box{
padding: 30px 10px 10px;
margin: 0 0 10px;
}

.result_item_point_h4_wrap{
}

h4.result_item_point_h4{
    padding: 5px 0px 6px 8px;
    height: 25px;
    font-size: 14px;
}

h4.result_item_point_h4:after{
    right: -16px;
    border-width: 25px 16px 0 0;
}

ul.result_item_point_list{
padding: 0 0 0 21px;
margin: 0 0 10px;
}

ul.result_item_point_list li{
position: relative;
margin: 0 0 10px;
}

ul.result_item_point_list li:after{
	left: -20px;
	top: 1px;
}

p.result_item_point_description{
	font-size: 12px;
}

.result_item_microcopy{
    margin: 0 0 5px;
}

.result_item_microcopy:before,.result_item_microcopy:after{
    width: 8px;
    height: 16px;
    right: -15px;
    background-size: contain;
}

.result_item_microcopy:before{
    left: -15px;
    right: auto;
}

.result_item_microcopy:after{

}

a.result_item_linkbutton{
    font-size: 16px;
    box-shadow: 0 4px 0 #B62400;
    border-radius: 6px;
    padding: 15px 0;
    position: relative;
    overflow: hidden;
    margin: 0 auto 8px;
}

p.result_addition{
font-size: 12px;
margin: 0 0 40px;
}

.result_item_comment{
margin: 0 0 10px;
}

h4.result_item_comment_h4{
padding: 8px 8px;
border-radius: 0 10px 0 0;
}

h4.result_item_comment_h4:before{
margin: 0 5px 0 0;
}

p.result_item_comment_text{
padding: 10px;
font-weight: bold;
font-size: 12px;
}

p.result_item_comment_text span.__color01{
}

table.result_item_spec02_table{
font-size: 12px;
margin: 0 0 10px;
}

table.result_item_spec02_table th,table.result_item_spec02_table td{
}

table.result_item_spec02_table th{
}

table.result_item_spec02_table td{
padding: 10px;
}

ul.result_item_spec02_tags{
}

ul.result_item_spec02_tags li{
flex-basis: calc((100% - 15px) / 4 );
margin: 0 0 5px;
padding: 4px 5px 5px;
}

ul.result_item_spec02_tags li.__strong{
}


/*about
---------------------------------------------------------------------------*/

section.about{
width: 100%;
padding: 0px 10px 0;
}

h2.about_h2{
font-size: 20px;
padding: 10px 0 10px;
margin: 40px 0 20px;
border-radius: 6px 6px 0 0;
}

h2.about_h2:after,h2.about_h2:before{

margin: 0 5px 0 5px;
}

table.about_table{
width: 940px;
border-collapse: collapse;
text-align: left;
margin: 0 auto 60px;
}

table.about_table{
width: 100%;
font-size: 14px;
margin: 0 auto 30px;
}

table.about_table tr{
border-bottom: dotted 1px #ccc;
}

table.about_table tr:first-child{
border-top: dotted 1px #ccc;
}

table.about_table th,table.about_table td{
padding: 15px 0px;
}

h4.about_h4{
font-size: 16px;
border-left: solid 4px #888;
padding: 0 0 0 6px;
margin: 0 0 10px;
}

p.about_p{
margin: 0 0 15px;
}

p.about_p:last-child{
margin: 0 0 30px;
}

/*survey
---------------------------------------------------------------------------*/

section.survey{
width: 100%;
padding: 0 10px;
}

h2.survey_h2{
font-size: 20px;
padding: 10px 0 10px;
margin: 40px 0 20px;
border-radius: 6px 6px 0 0;
}

h2.survey_h2:after,h2.survey_h2:before{

margin: 0 5px 0 5px;
}

h3.survey_h3{
font-size: 16px;
border-left: solid 6px #ccc;
border-bottom: solid 1px #ccc;
padding: 0 0 6px 6px;
margin: 0 0 10px;
}

p.survey_p{
margin: 0 0 15px;
}

p.survey_p:last-child{
margin: 0 0 30px;
}

/*search_step
---------------------------------------------------------------------------*/

section.top_search{
padding: 0 10px;
}

section.search_step{
padding: 0 0px;
margin: 0 0 10px;
top: 210px;
}

.hv_short section.search_step{
top: 156px;
}

form.search_step_form{
width: auto;
}

h2.search_step_h2{
border-radius: 10px 10px 0 0;
font-size: 14px;
padding: 12px 0 10px;
}

.search_step_h2_wrap{
margin: 10px 0 0;
position: relative;
}

img.search_step_h2_baloon{
width: 46px;
height: 46px;
top: -10px;
left: -10px;
}


#step_area html {
}
#step_area ol, #step_area ul {
}
#step_area table {
}
#step_area caption, #step_area th, #step_area td {
}
#step_area q, #step_area blockquote {
}
#step_area q:before, #step_area q:after, #step_area blockquote:before, #step_area blockquote:after {
}
#step_area a img {
}
#step_area article, #step_area aside, #step_area details, #step_area figcaption, #step_area figure, #step_area footer, #step_area header, #step_area hgroup, #step_area main, #step_area menu, #step_area nav, #step_area section, #step_area summary {
}
#step_area html {
}
#step_area body {
}
#step_area input, #step_area select, #step_area textarea, #step_area button, #step_area option {
}
#step_area button {
}
#step_area a {
}
#step_area input[type="submit"] {
}

#step_area {
  border: 1px solid var(--blue002);
  border-radius: 0 0 10px 10px;
  padding: 0px 10px 10px;
}

.search_step_wrap #step_area{
  padding: 10px 10px 10px;
}

.search_step_wrap section.search_step{
margin: 0 0 30px;
}

#step_area .step_title {  
  font-size: 14px;
  margin: 0 0 10px;
}
#step_area .step_count {
}
#step_area .step_count ul {
  margin: 0 0 0;
}
#step_area .step_count ul li {
font-size: 10px;
padding: 6px 5px;
}
#step_area .step_count ul li.active {
}
#step_area .step_count ul li.active:not(:first-of-type):before {
}
#step_area .step_count ul li:not(:first-of-type) {
}
#step_area .step_count ul li:not(:first-of-type):before {
}
#step_area .step_body {
  
}
#step_area .step_body .step {
}
#step_area .step_body .step.open {
}
#step_area .step_body .step .label_wrap {
  flex-basis: calc((100% - 10px) / 3);
  padding: 0;
  box-sizing: border-box;
}

#step_area .step_body .step.column2 .label_wrap {
  flex-basis: calc((100% - 5px) / 2);
}

#step_area .step_body .step.sp_column3 .label_wrap {
  flex-basis: calc((100% - 10px) / 3);
}


#step_area .step_body .step .label_wrap:nth-child(3n-1){
margin: 0 5px 5px 5px;
}

#step_area .step_body .step.column2 .label_wrap:nth-child(3n-1){
margin: 0 0px 5px 0px;
}

#step_area .step_body .step.column2 .label_wrap:nth-child(odd){
margin: 0 5px 5px 0;
}

#step_area .step_body .step .label_wrap label span {
  font-size: 13px;
  font-weight: bold;
  color: #666;
  padding: 6px;
  box-sizing: border-box;
  width: 100%;
  display: block;
  text-align: center;
  border: 1px solid var(--sub-color);
  border-radius: 5px;
  transition: .5s background-color,color;
  position: relative;
  background: #FFF4EB;
}

#step_area .step_body .step .label_wrap label span:after{
font-size: 12px;
right: 2px;
}


#step_area .step_body .step .label_wrap label input[type="radio"],
#step_area .step_body .step .label_wrap label input[type="checkbox"] {

}
#step_area .step_body .step .label_wrap label input[type="radio"]:checked + span,
#step_area .step_body .step .label_wrap label input[type="checkbox"]:checked + span {
}
#step_area .step_body .step .button_wrap {
  flex: 100%;
  padding: .5rem 0 0;
  display: flex;
  justify-content: space-evenly;
}
#step_area .step_body .step .button_wrap .button, #step_area .step_body .step .button_wrap button {
  padding: 10px 2rem;
  font-size: 12px;
  border: 1px solid #e7e7e7;
  border-radius: 20px;
}
#step_area button {
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
}

#step_area .step_body .step .button_wrap button.search_start{
background: #ff4b4b;
color: #fff;
font-weight: bold;
}

/*case
---------------------------------------------------------------------------*/

section.case{
margin: 0 0 40px;
}

h2.case_h2{
font-size: 24px;
margin: 0 0 10px;
}

.case_h2_baloon{
padding: 8px 8px 10px;
border-radius: 6px;
margin: 0 0 8px;
}

.case_h2_baloon:after{
    bottom: -8px;
    border-color: var(--blue002) transparent transparent transparent;
    border-width: 8px 5px 0 5px;
}

ul.case_carousel{
    padding: 0px 0 0 10px;
    margin: 0 0 0 10px;
}

li.case_item{
    margin: 0 6px 0 0px;
    display: inline-block;
    width: 210px;
    border-radius: 6px;
}

h3.case_h3{
    background: linear-gradient(to right, #2d85ed, #33ccff );
    color: #fff;
    padding: 8px;
    font-size: 12px;
    border-radius: 5px 5px 0px 0px;
}

section.case_item_main{
padding: 10px;
}

section.case_item_profile{
margin: 0 0 10px;
}

img.case_item_userimg{
width: 60px;
}

.case_item_data{
padding: 0 0 0 8px;
}

.case_item_name{
font-size: 14px;
margin: 0 0 8px;
}

.case_item_career{
padding: 5px;
border-radius: 3px;
}

p.case_item_description{
font-size: 10px;
}

.case_item_before-after{
margin: 0 0 10px;
}

.case_item_before-after:after{
	font-size: 14px;
}

.case_item_before,.case_item_after{
font-size: 12px;
padding: 25px 0 0;
}

.case_item_before:after,.case_item_after:after{
}

.case_item_after{
font-size:  14px;
}

.case_item_after:after{
}

h4.case_item_h4{
padding: 5px 5px;
margin: 0 0 5px;
border-radius: 3px;
}

ul.case_item_point{
padding: 0 0 0 10px;
margin: 0 0 10px;
height: 82px;
}

ul.case_item_point li{
margin: 0 0 5px;
font-size: 12px;
}

ul.case_item_point li:last-child{
margin: 0;
}

.case_item_using-site{
width: 120px;
    margin: 0px auto 10px;
    font-size: 10px;
    background-color: #2d85ed;
    padding: 4px 0px;
    border-radius: 35px;
    position: relative;
	font-weight: bold;
}

.case_item_using-site:after{
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    border-style: solid;
    border-color: #2d85ed transparent transparent transparent;
    border-width: 10px 5px 0 5px;
    z-index: 1;
}

a.case_item_cvbutton{
padding: 10px;
border-radius: 6px;
font-size: 12px;
font-weight: bold;
color: #fff;
box-shadow: 0px 4px 0px #cc3300;
}

img.case_item_logo{
width: 50%;
}

.case_item_cvbutton-copy{
padding: 0 0 0 8px;
}

/*method
---------------------------------------------------------------------------*/

section.method{
padding: 0 10px;
margin: 0 0 40px;
}

h2.method_h2{
    padding: 8px 15px 10px;
    border: solid 2px var(--blue000);
    border-radius: 6px;
    margin: 0 0 8px;
}

h2.method_h2:before{
    bottom: -9px;
    border-width: 9px 7px 0 7px;
}

h2.method_h2:after{
    bottom: -7px;
    border-width: 9px 7px 0 7px;
}

.method_box{
}

.method_box:before{
}

.method_item{
}

.method_item:first-child{
}

.method_item:last-child{
}

h3.method_item_h3{
}

p.method_item_text{
}

img.method_item_images{
}

.method_box02_wrap{
margin: 100px 0 0;
padding: 0 10px;
}

.method_box02_wrap:before{
width: 268px;
height: 96px;
top: -96px;
background-size: contain;
}

.method_box02{
padding: 0 15px;
border: solid 2px var(--blue002);
border-radius: 6px;
margin: 0 0 10px;
}

.method_box02:before{
border-width: 50px 50px 0 0;
}

.method_box02:after{
font-size: 20px;
top: 5px;
left: 8px;
}

.method_box02:nth-child(2):after{
}


h3.method_box02_h3{
font-size: 18px;
padding: 20px 0;
border-bottom: solid 1px var(--blue002);
margin: 0 0 10px;
}

p.method_box02_text{
font-size: 12px;
margin: 0 0 15px;
}

p.method_box02_text span.__red{
}

p.method_box02_text span.__blue{
}

img.method_box02_images{
margin: 0 0 15px;
}

/*whatis
---------------------------------------------------------------------------*/

section.whatis{
padding: 0 10px;
margin: 0 0 40px;
}

img.whatis_image{
}


/*qanda
----------------------------------------------------------------------*/

section.qanda{
padding: 0 10px;
margin: 0 0 40px;
}

#question .accordion-area{
    list-style: none;
	margin:0 auto;
}

#question .accordion-area li{
    margin: 5px 0;
}

#question .accordion-area li:last-child{
margin: 0;
}

#question .accordion-area section {
  border-radius: 6px;
}

/*アコーディオンタイトル*/
#question .title {
    font-size:12px;
    padding: 3% 3% 3% 25px;
    transition: all .5s ease;
	background: #fff;
	font-weight: bold;
	border-radius: 6px;
}

/*アイコンの＋と×*/
#question .title::before,
#question .title::after{
    position: absolute;
    content:'';
    width: 10px;
    height: 2px;
    background-color: #333;
    
}
#question .title::before{
    top:48%;
    left: 10px;
    transform: rotate(0deg);
    
}
#question .title::after{    
    top:48%;
    left: 10px;
    transform: rotate(90deg);

}
/*　closeというクラスがついたら形状変化　*/
#question .title.close::before{
  transform: rotate(45deg);
}

#question .title.close::after{
  transform: rotate(-45deg);
}

/*アコーディオンで現れるエリア*/
#question .box {
    display: none;/*はじめは非表示*/
    background: #f3f3f3;
  margin:0 3% 3% 3%;
    padding: 3%;
}

#question .box p{
font-size: 12px;
}

/*hellowork
---------------------------------------------------------------------------*/

section.hellowork{
padding: 0 10px;
margin: 0 0 40px;
}

h2.hellowork_h2{
  padding: 0 0 10px;
  font-size: 18px;
  border-bottom: solid 2px #888;
  margin: 0 0 15px;
  white-space: nowrap;
}

h2.hellowork_h2:before{
    bottom: -22px;
    border: 10px solid transparent;
    border-top: 13px solid #f5f5f5;
}

h2.hellowork_h2:after{
bottom: -24px;
    border: 10px solid transparent;
    border-top: 13px solid #888;
}

h2.hellowork_h2 span.__color01{
padding: 0 5px;
}

h2.hellowork_h2 span.__color02{
padding: 0 5px;
}

.hellowork_box_wrap{
margin: 10px 0 10px;
}

img.hellowork_box_graph{
width: calc(100vw - 20px);
}

.hellowork_box{
flex-basis: calc((100% - 10px) / 2);
}

.hellowork_box_label{
font-size: 14px;
padding: 8px 0;
margin: 0 0 5px;
}

.hellowork_box.__box02 .hellowork_box_label{
}

p.hellowork_box_description{
padding: 10px;
font-size: 12px;
margin: 0 0 5px;
height: 80px;
}

.hellowork_box.__box02 p.hellowork_box_description{
}

table.hellowork_box_table_merit,table.hellowork_box_table_demerit{
margin: 0 0 5px;
}

table.hellowork_box_table_merit th,table.hellowork_box_table_demerit th{
font-size: 14px;
padding: 5px 0 7px;
}

.hellowork_box.__box02 table.hellowork_box_table_merit th,.hellowork_box.__box02 table.hellowork_box_table_demerit th{
}

table.hellowork_box_table_merit td,table.hellowork_box_table_demerit td{
background: #fff;
white-space: nowrap;
padding: 10px 0;
    text-shadow: 1px 1px 0 #fff, 1px 0px 0 #fff, 0px 1px 0 #fff, 0px -1px 0 #fff, -1px 0px 0 #fff, -1px 1px 0 #fff, 1px -1px 0 #fff, -1px -1px 0 #fff;
}

table.hellowork_box_table_merit td{
height: 110px;
background-image: url(../images/20s_hellowork_table_bgicon_01.png);
background-repeat: no-repeat;
background-position: center;
background-size: 80px 80px;
}

table.hellowork_box_table_demerit td{
height: 100px;
background-image: url(../images/20s_hellowork_table_bgicon_02.png);
background-repeat: no-repeat;
background-position: center;
background-size: 80px 80px;
}

ul.hellowork_box_table_list li{
font-size: 12px;
font-weight: bold;
}

ul.hellowork_box_table_list li:before{
}

.hellowork_comment{
}

.hellowork_comment span.__color01{
}

img.hellowork_comment_icon{
width: 100px;
margin: 0 10px 0 0;
}

.hellowork_comment_text{
    padding: 10px;
    border-radius: 6px;
    position: relative;
    font-size: 14px;
}

.hellowork_comment_text:before{
    left: -10px;
    top: 20px;
    border-right: 10px solid var(--blue004);
    border-top: 8px solid transparent;
    border-bottom: 10px solid transparent;
}

.hellowork_compare_h2_baloon {
    padding: 8px 8px 10px;
    border-radius: 6px;
    margin: 0 0 10px;
    font-size: 20px;
}

.hellowork_compare_h2_baloon:after {
    bottom: -8px;
    border-color: #fe9d3c transparent transparent transparent;
    border-width: 8px 5px 0 5px;

}

.hellowork_compare_h2_baloon_subtitle{
margin: 0 0 5px;
font-size: 14px;
}

.hellowork_compare_h2_baloon_subtitle:before,.hellowork_compare_h2_baloon_subtitle:after{
height: 1.0rem;
}

.hellowork_compare_h2_baloon_subtitle:before{
border-left: solid 2px #3F3F3F;
left: -5px;
}

.hellowork_compare_h2_baloon_subtitle:after {
    border-right: solid 2px #3F3F3F;
    right: -5px;
}



/*#point-agent
---------------------------------------------------------------------------*/


section.agent{
padding: 0 10px;
margin: 0 0 40px;
}

.agent_wrap{
padding: 10px;
border-radius: 6px;
margin: 0 0 10px;
}

.point-agent_h2_wrap{
margin: 0 0 10px;
}

.point-agent_h2_subtitle{
font-size: 16px;
padding: 5px 20px;
}

h2.point-agent_h2{
padding: 15px 0 0;
font-size: 20px;
}

span.point-agent_h2_span-circle{
    padding: 5px 0 0 0;
    background: url(../images/20s_hellowork_table_bgicon_02_40x10.png);
    background-repeat: repeat-x;
    background-size: 20px 5px;
    background-position: 0px 0px;
}

table.point-agent_table{
}

table.point-agent_table th{
font-size: 18px;
padding: 0 5px 0 0;
}

table.point-agent_table th:nth-child(odd){
border-right: solid 1px #ccc;
}

table.point-agent_table th:nth-child(even){
padding: 0 0 0 5px;
}

.point-agent_table_th_baloon{
padding: 6px 10px 8px;
margin: 0 0 8px;
font-size: 16px;
}

.point-agent_table_th_baloon.baloon_blue{
}

.point-agent_table_th_baloon:after{
    bottom: -8px;
    left: 50%;
    border-width: 8px 5px 0 5px;
    z-index: 1;
}

.point-agent_table_th_baloon.baloon_blue:after{

}


p.point-agent_table_th_description{
font-size: 10px;
padding: 5px;
}

table.point-agent_table td{
font-size: 12px;
width: 50%;
}

table.point-agent_table td{
}


table.point-agent_table td:nth-child(odd){
padding: 15px 30px 15px 0;
border-right: solid 1px #ccc;
}

table.point-agent_table td:nth-child(odd):after{
position: absolute;
content: '';
background: url(../images/20s_point-agent_table_after01.png);
width: 50px;
height: 50px;
right: -25px;
background-size: contain;
background-repeat: no-repeat;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

table.point-agent_table tr:last-child td:nth-child(odd):after{
background: url(../images/20s_point-agent_table_after02.png);
background-size: contain;
background-repeat: no-repeat;
}

table.point-agent_table td:nth-child(even){
padding: 10px 0 10px 30px;
}

span.color-red{
}

span.under-line_yellow{
}

.point-agent_comment{
margin: 0 0 10px;
}

.point-agent_baloon{
font-size: 12px;
    border: solid 1px #666;
    padding: 10px;
    border-radius: 6px;
}

.point-agent_baloon:after{
    left: -9px;
    top: 20px;
    border-right: 10px solid #fff;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
}

.point-agent_baloon:before{
    left: -10px;
    top: 20px;
    border-right: 10px solid #666;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
}

img.point-agent_human{
width: 100px;
}

p.agent_addition{
font-size: 10px;
}

/*topcategory
---------------------------------------------------------------------------*/

section.topcategory{
padding: 0 10px;
margin: 0 0 40px;
}

.topcategory_wrap{
border: solid 1px #666;
border-radius: 6px;
padding: 10px;
}

.topcategory_item {
}

.topcategory_item:not([open]) {
    margin-bottom: 5px;
}

.topcategory_item summary {
    padding: 10px 20px 10px 43px;
    border-radius: 6px;
    font-size: 18px;
}

.topcategory_item summary:not(:last-child){
margin: 0 0 8px;
}

.topcategory_item summary::-webkit-details-marker {
}

.topcategory_item summary::after {
width: 8px;
height: 8px;
right: 20px;
border-bottom: 3px solid #666;
border-right: 3px solid #666;
}

.topcategory_item[open] summary::after {
}

.topcategory_item summary:before{
width: 25px;
height: 25px;
left: 10px;
}

.topcategory_item summary.__category02:before{

}

.topcategory_item summary.__category03:before{

}

.topcategory_item summary.__category04:before{

}

.topcategory_item summary span.__small{
font-size: 10px;
}

.topcategory_item .topcategory_item_content {
transform: translateY(-10px);
padding: 0 0 10px;
}

.topcategory_item[open] .topcategory_item_content {
}

a.topcategory_item_link{
flex-basis: calc(50% - 5px);
padding: 10px;
border-radius: 6px;
border: solid 2px #666;
font-size: 16px;
}

a.topcategory_item_link:nth-child(odd){
margin: 0 5px 10px 0;
}

a.topcategory_item_link:nth-child(even){
margin: 0 0 10px 5px;
}

a.topcategory_item_link:after{
font-size: 12px;
right: 7px;
}

/*bestone
---------------------------------------------------------------------------*/

section.bestone{
margin: 0 0 40px;
}

h2.bestone_h2{
margin: 0 0 10px;
padding: 15px 0;
font-size: 20px;
}

h2.bestone_h2:after{
bottom: -8px;
border-width: 8px 6px 0 6px;
}

span.bestone_h2_subtitle{
font-size: 14px;
padding: 5px 0;
border-top: solid 1px #fff;
border-bottom: solid 1px #fff;
margin: 0 0 5px;
}

span.bestone_h2_title{
}

.bestone_wrap{
padding: 0 10px;
}

.bestone_wrap .pickup_item{
border: solid 1px var(--blue002);
}


.bestone_wrap .pickup_item{
}

.pickup_item_inner{
}

p.pickup_item_notice{
margin: 8px 0 0;
font-size: 10px;
}

/*pickup_top
---------------------------------------------------------------------------*/

section.pickup_top{
padding: 65px 10px 30px;
margin: 70px 0 40px;
border-radius: 0px;
}

.pickup_top_wrap .pickup_item{
padding: 6px;
}

.pickup_top_wrap img.pickup_item_banner{
width: 120px;
}

.pickup_top_wrap a.pickup_item_banner_wrap{
margin: 0 6px 0 0;
}

.pickup_top_wrap .pickup_item_spec .__label{
font-size: 12px;
    padding: 4px 3px 6px;
    margin: 0 5px 0 0;
}

.pickup_top_wrap .pickup_item_spec .__contents{
font-size: 12px;
}

.pickup_top_wrap .pickup_item_spec .__contents b{
font-size: 16px;
}

.pickup_top_wrap .pickup_item_spec_wrap .pickup_item_spec:first-child:after{
display: none;
}

.pickup_top_wrap .pickup_item_spec_wrap{
}

.pickup_top_baloon{
width: calc(100% - 40px);
border-radius: 6px;
top: -56px;
}

.pickup_top_baloon_inner{
padding: 15px 10px 15px;
}

.pickup_top_baloon_inner:after{
bottom: -10px;
border-width: 11px 6px 0 6px;
}

.pickup_top_baloon_title{
font-size: 16px;
margin: 0 0 8px;
}

.pickup_top_baloon_title:after{

}

.pickup_top_baloon_title span.__big{
font-size: 140%;
}

p.pickup_top_baloon_text{
font-size: 12px;
}

/*result02
---------------------------------------------------------------------------*/

.result_header_baloon{
text-align: center;
}

.result_header_baloon_title{
font-size: 16px;
margin: 0 0 10px;
}

.result_header_baloon_title span.__num{
}

.result_header_baloon_description{
font-size: 12px;
padding: 10px;
border: solid 1px #ff7e0e;
border-radius: 6px;
margin: 0 0 18px;
}

.result_header_baloon_description i{
}

.result_header_baloon_description:before{
bottom: -15px;
border-top: 15px solid #ff7e0e;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
}

.result_header_baloon_description:after{
bottom: -13px;
border-top: 13px solid #FFF4EB;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
}

/*befoaf
---------------------------------------------------------------------------*/

section.befoaf{
margin: 0 0 40px;
padding: 0 10px;
}

h2.befoaf_h2{
font-size: 16px;
padding: 10px 15px;
margin: 0 0 10px;
}

h2.befoaf_h2:before,h2.befoaf_h2:after{
margin: 6px;
}

.befoaf_item_wrap{
margin: 0 0 10px;
}

.befoaf_item{
width: calc(100% - 5px);
border-radius: 6px;
padding: 10px;
margin: 0 5px 0 0;
}

.befoaf_item:last-child{
margin: 0 0 0 5px;
}

.befoaf_item_title{
border-bottom: solid 2px #000;
padding: 5px 10px 5px 15px;
margin: 12px 0 20px 40px;
}

.befoaf_item_title:before{
width: 50px;
height: 50px;
left: -40px;
}

.befoaf_item.__item02 .befoaf_item_title:before{
}

.befoaf_item_before,.befoaf_item_after{
padding: 10px 10px 10px 50px;
border-radius: 6px;
font-size: 14px;
}

.befoaf_item_before span.__small,.befoaf_item_after span.__small{
font-size: 11px;
}

.befoaf_item_before:before,.befoaf_item_after:before{
width: 30px;
height: 30px;
left: 10px;
}

.befoaf_item_before{
margin: 0 0 10px;
}

.befoaf_item_before:after{
font-size: 12px;
bottom: -12px;
}

.befoaf_item_after{
}

.befoaf_item_after:before{
}

.befoaf_comment{
padding: 18px;
border: solid 2px #000;
border-radius: 6px;
}

p.befoaf_comment_text{
font-size: 14px;
padding: 0 0 0 70px;
}

p.befoaf_comment_text span.__color01{
}

p.befoaf_comment_text:before{
width: 60px;
height: 60px;
}

a.befoaf_linkbutton{
padding: 15px 0;
font-size: 16px;
max-width: 310px;
margin: 10px auto 0;
box-shadow: 0 5px 0 #600D16;
}

a.befoaf_linkbutton:after{
right: 10px;
}

/*result02
---------------------------------------------------------------------------*/

.result02_item{
padding: 10px;
box-shadow: 0px 1px 2px rgb(0 0 0 / 30%);
margin: 0 0 15px;
border-radius: 6px;
border: solid 2px var(--blue001);
}

.result02_item h3.ranking_item_header_h3{
}

/*compare02
---------------------------------------------------------------------------*/

section.compare02{
margin: 0 0 40px;
}

section.compare02 p.comparison_table_notice{
padding: 0 10px;
}

h2.cpmpare02_h2{
font-size: 28px;
margin: 0 0 10px;
}

h2.cpmpare02_h2 span.__color01{
}

span.cpmpare02_h2_subtitle{
padding: 5px;
border-top: solid 2px #3F3F3F;
border-bottom: solid 2px #3F3F3F;
font-size: 18px;
}

.cpmpare02_table_wrap {
}

.cpmpare02_table_wrap.__baloon_visible{
padding: 30px 0 0;
}

table.cpmpare02_table{
}

table.cpmpare02_table th{
width: 70px;
font-size: 11px;
padding: 10px 0;
border: solid 1px #ccc;
}

table.cpmpare02_table td{
font-size: 13px;
width: 160px;
border: solid 1px #ccc;
padding: 10px 10px;
}

.__service_baloon{
top: -27px;
}

.__service_baloon_inner{
font-size: 11px;
padding: 0px 6px 0px 22px;
height: 24px;
line-height: 24px;
}

.__service_baloon_inner:after{
bottom: -8px;
border-width: 8px 4px 0 4px;
}

.__service_baloon_inner:before{
width: 24px;
height: 24px;
border: solid 2px var(--red001);
left: -4px;
}

.__service_baloon_inner.__baloon02{

}

.__service_baloon_inner.__baloon02:after{

}

.__service_baloon_inner.__baloon02:before{
border: solid 2px #00a678;
}

.__service_baloon_inner.__baloon02{

}

.__service_baloon_inner.__baloon02:after{

}

.__service_baloon_inner.__baloon02:before{
border: solid 2px #00a678;
}

.__service_baloon_inner.__baloon03{

}

.__service_baloon_inner.__baloon03:after{

}

.__service_baloon_inner.__baloon03:before{
border: solid 2px #476DFF;
}

.__service_baloon_inner.__baloon04{
}

.__service_baloon_inner.__baloon04:after{
}

.__service_baloon_inner.__baloon04:before{
border: solid 2px #005CCB;
}

.__service_baloon_inner.__baloon05{
}

.__service_baloon_inner.__baloon05:after{
}

.__service_baloon_inner.__baloon05:before{
border: solid 2px #188065;
}


a.__service_banner_wrap{
margin: 0 0 5px;
}

img.__service_banner{
width: 100px;
}

a.__service_textlink{
font-size: 12px;
}

a.__service_textlink:after{
  font-size: 10px;
  margin: 0 0 0 2px;
}

tr.cpmpare02_table__service td{
}

tr.cpmpare02_table__service td span.__inlineblock{
}

tr.cpmpare02_table__score td{
font-size: 14px;
}

span.__score_strong{
font-size: 18px;
}

.__score_wrap:before{
margin: 0 2px 0 0;
}

span.__amount_strong{
font-size: 16px;
}

table.cpmpare02_table td.ev01,table.cpmpare02_table td.ev02,table.cpmpare02_table td.ev03{
height: 60px;
background-size: 50px;
text-shadow: 1px 1px 0 #fff, 1px 0px 0 #fff, 0px 1px 0 #fff, 0px -1px 0 #fff, -1px 0px 0 #fff, -1px 1px 0 #fff, 1px -1px 0 #fff, -1px -1px 0 #fff;
}

table.cpmpare02_table td.ev01{
}

tr.cpmpare02_table__description td{
padding: 10px 6px;
}

p.__description_text{
}

p.__description_text span.__color01{
}

span.__area_strong{
font-size: 16px;
}

span.__occupation_strong{
font-size: 16px;
}

a.__link_linkbutton{
font-size: 14px;
box-shadow: 0px 3px 0px #B62400;
padding: 5px 24px;
border-radius: 6px;
}

a.__link_linkbutton:after{
    width: 10px;
    top: -90px;
}

ul.__ocupation_list{
}

ul.__ocupation_list li{
}

ul.__ocupation_list li span.__all{
font-size: 16px;
}

.__skills_detail_title{
}

.__skills_detail_title:before{
margin: 0 2px 0 0;
}

p.__skills_detail{
font-size: 10px;
padding: 8px 4px;
}



/*newrank
---------------------------------------------------------------------------*/

section.newrank{
}


h2.newrank_h2{
    margin: 0 0 10px;
    padding: 25px 0 15px;
    color: #fff;
    background-image: url(../images/20s_bestone_h2_bgimages01.png);
    background-size: 100% auto;
    background-position: center;
    text-align: center;
    position: relative;
font-size: 26px;
margin: 45px 0 40px;
}

h2.newrank_h2 .__subtitle{
padding: 5px 5px;
font-size: 14px;
}

.newrank_h2_baloon_wrap{
top: -15px;
}

.newrank_h2_baloon{
padding: 8px 15px;
border: solid 3px #0c407d;
font-size: 12px;
}

.newrank_h2_baloon:after{
bottom: -8px;
border-width: 8px 5px 0 5px;
}


.newrank_box{
padding: 35px 0px 10px 10px;
margin: 0 0 40px;
}

.newrank_header{

}

.newrank_h3_wrap{
top:-25px;
}

h3.newrank_h3{
height: 40px;
line-height: 40px;
font-size: 18px;
padding: 0 10px;
}

h3.newrank_h3:before{
border-width: 20px 15px 0px 0px;
right: -15px;
}

h3.newrank_h3:after{
border-width: 20px 0px 0px 15px;
right: -15px;
}

h3.newrank_h3 i{
width: 21px;
height: 21px;
vertical-align: -2px;
margin: 0 5px 0 0;
}

.newrank_target{
padding: 15px 10px 10px;
border-radius: 6px;
border: solid 1px #7E6F54;
margin: 0 0 15px;
width: calc(100% - 10px);
}

 .newrank_target .__label{
 font-size: 12px;
 top:-12px;
 padding: 5px 8px;
 border-radius: 5px 5px 5px 0px;
 }

.newrank_target p.__description{
font-size: 11px;
margin:5px 0 0;
}

ul.newrank_list{
}

ul.newrank_list li{
margin: 0 10px 0 0;
font-size: 16px;
}

ul.newrank_list li:before{
    margin: 0 2px 0 0;
}

ul.newrank_caroucel{
padding: 4px 0 5px;
}

li.newrank_caroucel_item{
margin: 0 6px 0 0px;
width: 190px;
border-radius: 6px;
padding: 10px;
box-shadow: 0px 2px 4px rgb(0 0 0 / 30%);
}

li.newrank_caroucel_item .__header_rank{
    position: absolute;
    height: 32px;
    width: 27px;
    font-size: 14px;
    padding: 4px 0 0;
    left: 5px;
    top: -8px;
}

ul.newrank_caroucel li.newrank_caroucel_item:nth-child(1) .__header_rank{
}

ul.newrank_caroucel li.newrank_caroucel_item:nth-child(2) .__header_rank{
}

ul.newrank_caroucel li.newrank_caroucel_item:nth-child(3) .__header_rank{
}

ul.newrank_caroucel li.newrank_caroucel_item:nth-child(2){

}

li.newrank_caroucel_item .__service_wrap{
height: 41px;
margin: 0 0 12px;
}

li.newrank_caroucel_item a.__service{
font-size: 16px;
}

li.newrank_caroucel_item a.__service span.__inlineblock{
}

li.newrank_caroucel_item .__spec_wrap{
}

li.newrank_caroucel_item img.__banner{
width: 75px;
}

li.newrank_caroucel_item a.__banner_wrap{
margin: 0 6px 0 0;
}

li.newrank_caroucel_item .__spec{
}

li.newrank_caroucel_item .__spec_amount{
font-size: 10px;
padding: 8px 0 2px;
margin: 0 0 10px;
}

li.newrank_caroucel_item .__spec_amount span.__strong{
font-size: 12px;
}

li.newrank_caroucel_item .__spec_amount_label{
padding: 2px 4px;
border-radius: 3px;
top: -6px;
}

li.newrank_caroucel_item p.__description{
font-size: 13px;
    background-size: 100% 2em;
    line-height: 2.0em;
    padding-bottom: 2px;
    margin: 0 0 10px;
    height: 80px;
}

li.newrank_caroucel_item a.__linkbutton{
font-size: 12px;
box-shadow: 0 3px 0 #B62400;
padding: 8px 0;
width: calc(100% - 10px);
margin: 0 auto 3px;
}

p.newrank_notice{
margin: 8px 0 0;
font-size: 10px;
}

section.newrank.newrank_nottop{
margin: 60px 0 40px;
}

/*combi
---------------------------------------------------------------------------*/

section.combi{
margin: 0 0 40px;
}

table.combi_table{
border-spacing: 5px;
}

th.combi_table_th_01{
font-size: 14px;
border-radius: 6px 0 0 6px;
width: 32px;
}

th.combi_table_th_02{
font-size: 13px;
padding:8px;
text-shadow: 0px -1px 0px var(--blue000);
}

th.combi_table_th_02:after{
border: 12px solid transparent;
border-left: 9px solid #4B96EF;
}

p.combi_table_description{
font-size: 11px;
}

.combi_table_title{
padding: 0 0 0 35px;
margin: 0 0 10px;
}

.combi_table_title:before{
padding: 8px;
font-size: 14px;
}

table.combi_table tr:nth-child(2) .combi_table_title:before{
}

table.combi_table tr:nth-child(3) .combi_table_title:before{
}

.combi_table_label{

}

td.combi_table_td{
padding: 8px;
border: solid 1px var(--blue002);
border-radius: 0 6px 6px 0;
width: 110px;

}

a.combi_banner_wrap{
margin: 0 auto 4px;
width: calc(100% - 8px);
}

img.combi_banner{
}

a.combi_table_textlink{
font-size: 10px;
}

a.combi_table_textlink span.__inlineblock{
}

table.combi_table.__table02 th.combi_table_th_01{
}

table.combi_table.__table02 th.combi_table_th_02{
text-shadow: 0px -1px 0px #964055;
}

table.combi_table.__table02 td.combi_table_td{
border: solid 1px #D35A78;
}



table.combi_table.__table02 .combi_table_title:before{
}

table.combi_table.__table02 th.combi_table_th_02:after{
border-left: 9px solid #D35A78;
}

table.combi_table.__table03 th.combi_table_th_01{
}

table.combi_table.__table03 th.combi_table_th_02{
text-shadow: 0px -1px 0px #2D6B5B;
}

table.combi_table.__table03 td.combi_table_td{
border: solid 1px #48AA91;
}

table.combi_table.__table03 .combi_table_title:before{
}

table.combi_table.__table03 th.combi_table_th_02:after{
border-left: 9px solid #48AA91;
}

.combi_h2_02_wrap{
padding: 30px 0 20px;
margin: 0 0 10px;
border-radius: 0px;
}

.combi_h2_02_wrap:before{
}


h2.combi_h2_02{
font-size: 24px;
text-shadow: 0px 2px 0px rgb(0 0 0 / 20%);
}

h2.combi_h2_02:before{
font-size: 10px;
padding: 11px 10px;
margin: 0 6px 0 0;

}

.combi_h2_02_subtitle{
font-size: 16px;
text-shadow: 0px 2px 0px rgb(0 0 0 / 20%);
}

.combi_h2_02_subtitle span.__underline{
border-bottom: solid 2px #fff;

}

/*newgrad_tab
---------------------------------------------------------------------------*/

.newgrad_tab01_wrap {
margin: 8px 0 0;
}
.newgrad_tab01_wrap:after {
  height: 2px;
}
.newgrad_tab01_label {
  font-size: 13px;
  text-shadow: 0 -1px 0 rgba(0,0,0,.4);
  padding: 8px 0;
  border-radius: 4px 4px 0 0;
  width: calc((100% - 150px)/2);
}
.newgrad_tab01_label:not(:last-of-type) {
  margin-right: 3px;
}
.newgrad_tab01_content {
}
/* アクティブなタブ */
.newgrad_tab01_switch:checked+.newgrad_tab01_label {
  padding: 13px 0;
  width: 144px;
  font-size: 16px;
}

.newgrad_tab01_switch:checked+.newgrad_tab01_label:after{

}

.newgrad_tab01_switch:checked+.newgrad_tab01_label+.newgrad_tab01_content {
  padding: 10px 0 0;
}
/* ラジオボタン非表示 */
.newgrad_tab01_switch {
}

.newgrad_tab02_wrap {
margin: 8px 0 0;
}
.newgrad_tab02_wrap:after {
  height: 2px;
}
.newgrad_tab02_label {
  font-size: 13px;
  text-shadow: 0 -1px 0 rgba(0,0,0,.4);
  padding: 8px 0;
  border-radius: 4px 4px 0 0;
  width: calc((100% - 150px)/2);
}
.newgrad_tab02_label:not(:last-of-type) {
  margin-right: 3px;
}
.newgrad_tab02_content {
}
/* アクティブなタブ */
.newgrad_tab02_switch:checked+.newgrad_tab02_label {
  padding: 13px 0;
  width: 144px;
  font-size: 16px;
}

.newgrad_tab02_switch:checked+.newgrad_tab02_label:after{

}

.newgrad_tab02_switch:checked+.newgrad_tab02_label+.newgrad_tab02_content {
  padding: 10px 0 0;
}
/* ラジオボタン非表示 */
.newgrad_tab02_switch {
}

/*post
---------------------------------------------------------------------------*/

section.post{
padding: 0 10px;
margin: 10px 0 40px;
}

h2.post_h2{
    padding: 30px 20px;
    font-size: 20px;
    margin: 0 0px 10px;
    border-radius: 4px;
}

span.post_h2_subtitle{
font-size: 10px;
}

.post_date{
    font-size: 12px;
    text-align: right;
    margin-bottom: 10px;
}

.post_date:before{
}

p.post_desciption{
font-size: 14px;
margin: 0 0 20px;
}

h3.post_h3{
    padding: 0 0 5px;
    margin: 0px 0px 10px;
    font-size: 16px;
    border-bottom: 3px solid #2d85ed;
}

h3.post_h3:before{
    bottom: -3px;
    height: 3px;
}

h4.post_h4{
font-size: 14px;
    margin: 0 0 10px;
    padding: 4px 4px;
    border-left: solid 4px #2d85ed;
}

h2.post_h2_list{
    font-size: 20px;
    padding: 15px;
    margin: 0 0 20px;
}

span.post_h2_list_subtitle{
font-size: 10px;
}

h3.post_h3_list{
    font-size: 16px;
    border-left: solid 4px #2d85ed;
    padding: 0 0 0 8px;
    margin: 0 0 10px;
}

ul.post_list{
padding: 0 10px;
margin: 0 0 20px;
}

ul.post_list li{
margin: 0 0 10px;
}

ul.post_list a{
}

ul.post_list a:before{
    margin: 0 4px 0 0;
}

/*column_menu
---------------------------------------------------------------------------*/

section.column_menu{
padding: 0 10px;
margin: 0 0 40px;
}

ul.column_menu_list{
    border-radius: 10px 10px 0px 0px;
    border: solid 1px #ccc;
}
ul.column_menu_list a{
    font-size: 14px;
}

ul.column_menu_list a:not(:last-child):before{
    font-size: 10px;
    left: 10px;
}

ul.column_menu_list a:not(:last-child):after{
    width: calc(100% - 20px);
    height: 1px;
    left: 10px;
}

ul.column_menu_list li{
padding: 15px 10px 15px 20px;
}

ul.column_menu_list a:last-child{
    font-size: 12px;
}

ul.column_menu_list a:last-child li{
    padding: 5px 5px;
}

ul.column_menu_list a:last-child li i{
}

.v2_slider {
    overflow: hidden;
    width: 100%;

    ul {
      justify-content: flex-start;
      animation: marquee 20s linear infinite;
      width: max-content;
    }
    li {
      flex-shrink: 0;
    }

    /* SP版では全て表示 */
    li:nth-child(n + 6) {
      display: block;
    }
}



.pc{
display: none;
}

}