@charset "UTF-8";
 span.supText {
font-size: 75.5%;
vertical-align: top;
position: relative;
top: -0.5em;
} .check_footer{
position:relative;
margin:0 auto;
padding:0;
width:100%;
}
.check_footer img{
width:100%;
height:auto;
vertical-align:top;
}
.check_footer .check_ft_innr{
margin:0 auto;
padding-top:40px;
width:100%;
max-width:950px;
}
.check_footer .check_ft_logo{
margin:0 auto 25px auto;
padding:0;
width:571px;
}
.check_footer .check_ft_kv{
margin:0 auto;
padding:0;
width:950px;
}
.check_footer .mod-intro{
margin-top:35px;
margin-bottom:50px;
text-align:left;
}
.check_footer .mod-intro .title{
font-size:2.2em;
line-height:1.5em;
}
.check_footer .contents-sec {
position: relative;
top: 0;
left: 0;
overflow:visible;
}
.check_footer .contents-sec .ttl{
margin-bottom: 2.2rem;
padding-top: .15rem;
padding-bottom: .15rem;
padding-left: 4.7rem;
font-size: 2rem;
line-height:33px;
color:#9fc238;
background-image:url(//www.kracie.co.jp/ph/k-kampo/wp-content/themes/kracie/kazelab/footer/imgs/icn_ttl_q.gif);
background-repeat:no-repeat;
background-position:top 0 left 0;
background-size:auto;
}
.check_footer .contents-sec .txt{
position:relative;
font-size:1.4rem;
line-height:30px; }
.check_footer .pop-over{
position:relative;
display:inline-block;
color:#8fae32;
line-height:20px; text-decoration:none;
border-bottom:1px dotted #9fc238;
}
.check_footer .pop_detail{
display:none;
position:absolute;
padding:12px;
font-size:1.4rem;
line-height:2.1rem;
color:#000;
width:260px;
height:auto;
bottom:32px;
left:50%;
transform:translate(-50%,0);
box-sizing:border-box;
border:1px solid #c4c4c4;
background-color:#fff;
border-radius:6px;
box-shadow:2px 2px 8px rgba(0,0,0,0.3);
z-index:5;
}
.check_footer .pop_detail.txt_posi1{
margin-left:70px;
}
.check_footer .pop_detail.txt_posi5{
margin-left:80px;
}
.check_footer .pop_detail::before{
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
left: 50%;
transform:translate(-50%,0);
bottom:-11px;
border-top:11px solid #c4c4c4;
border-right:11px solid transparent;
border-left:11px solid transparent;
}
.check_footer .pop_detail::after{
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
left: 50%;
transform:translate(-50%,0);
bottom:-10px;
border-top:11px solid #fff;
border-right:11px solid transparent;
border-left:11px solid transparent;
}
.check_footer .pop-over:hover .pop_detail {
display: block;
}
@media (max-width:640px){
.check_footer .check_ft_innr{
padding-top:8vw;
width:90vw;
}
.check_footer .check_ft_logo{
margin:0 auto 6vw auto;
width:90vw;
}
.check_footer .check_ft_kv{
width:90vw;
}
.check_footer .mod-intro{
margin-top:7vw;
margin-bottom:7vw;
}
.check_footer .mod-intro .title{
font-size:1.6em;
line-height:1.6em;
}
.check_footer .contents-sec .ttl{
margin-bottom:2.2rem;
padding-left:5rem;
font-size:2rem;
line-height:3rem;
}
.check_footer .contents-sec .txt{
position:relative;
font-size:1.4rem;
line-height:3rem;
}
.check_footer .pop-over{
line-height:1.5em;
}
.check_footer .pop_detail{
padding:3vw;
font-size:1.4rem;
line-height:2.1rem;
width:50vw;
}
.check_footer .pop_detail.txt_posi1{
margin-left:-5vw;
}
.check_footer .pop_detail.txt_posi2{
margin-left:20vw;
}
.check_footer .pop_detail.txt_posi5{
margin-left:10vw;
}
} .catch_fig_area{
margin:70px 0 80px 0;
padding:0;
}
.arrw_red{
margin-left:600px;
margin-bottom:25px;
padding:0;
width:38px;
} .catch_fig1{
margin-bottom:25px;
padding:0;
text-align:left;
}
.catch_fig1_list{
margin:0;
padding:0;
list-style:none;
display:flex;
justify-content: center;
align-items: center;
}
.catch_fig1_list li{
position:relative;
}
.catch_fig1_ttl{
margin:0;padding:0;
font-size:20px;
line-height:28px;
font-weight:bold;
color:#9fc238;
text-align:center;
width:270px;
}
.catch_fig1_detail{
width:680px;
height:230px;
background-color:#f8fbf1;
}
.catch_fig1_left{
margin:0;
padding:40px 0 0 40px;
}
.catch_fig1_left_ttl{
display:inline-block;
margin-bottom:20px;
padding:0 25px;
font-size:18px;
line-height:42px;
color:#9fc238;
border-radius:21px;
background-color:#fff;
}
.catch_fig1_txt{
margin-bottom:10px;
padding:0;
font-size:15px;
color:#333;
}
article.contents-blk p.catch_fig1_txt{
margin-bottom:10px;
padding:0;
font-size:15px;
color:#333;
line-height: 1.5rem;
}
.catch_fig1_illust1{
position:absolute;
width:360px;
right:30px;
top:50%;
transform:translate(0,-50%);
z-index:2;
}
.illust_barrier1_list{
margin-top:12px;
display:flex;
justify-content:space-between;
}
.illust_barrier1_list li{
list-style:none;
vertical-align:top;
width:33%;
font-size:15px;
font-weight:bold;
color:#9fc238;
text-align:center;
}
.illust_barrier1{
width:360px;
}
.catch_fig1_illust2{
position:absolute;
width:315px;
right:70px;
top:50%;
transform:translate(0,-50%);
z-index:2;
}
.illust_barrier2_txt{
position:absolute;
font-size:15px;
font-weight:bold;
color:#9fc238;
top:0;
left:50%;
transform:translate(-50%,0);
z-index:2;
}
.illust_barrier2{
width:315px;
}
.catch_fig1_illust3{
position:absolute;
width:250px;
right:62px;
top:50%;
transform:translate(0,-50%);
z-index:2;
}
.illust_barrier3_txt{
position:relative;
margin-top:10px;
font-size:15px;
font-weight:bold;
color:#9fc238;
text-align:center;
}
article.contents-blk p.illust_barrier3_txt{
margin-bottom:10px;
padding:0;
font-size:15px;
line-height: 1.5rem;
}
.illust_barrier3{
width:250px;
}
.catch_fig1_note{
margin-left:270px;
font-size:1.3rem;
line-height:20px;
color:#333;
text-indent:-1em;
padding-left:1em;
}
article.contents-blk p.catch_fig1_note{
margin-bottom:0;
padding:0;
font-size:13px;
line-height: 20px;
}
@media (max-width:640px){
.catch_fig_area{
margin:6vw 0;
}
.arrw_red{
margin:0 auto;
margin-bottom:5vw;
width:6vw;
}
.catch_fig1{
margin-bottom:5vw;
}
.catch_fig1_list{
margin:0;
display:block;
justify-content:start;
align-items: center;
}
.catch_fig1_list li{
position:relative;
}
.catch_fig1_ttl{
margin-bottom:4vw;
font-size:1.9rem;
line-height:2.5rem;
width:90vw;
}
.catch_fig1_detail{
width:90vw;
height:auto;
background-color:#f8fbf1;
}
.catch_fig1_left{
margin:0;
padding:6vw 0;
text-align:center;
}
.catch_fig1_left_ttl{
margin-bottom:4vw;
padding:0 6vw;
font-size:1.2em;
line-height:10vw;
border-radius:5vw;
}
.catch_fig1_txt{
margin:0 auto 3vw auto;
width:60vw;
font-size:1.1em;
text-align:left;
}
.catch_fig1_illust1{
position:relative;
margin:0 auto;
padding-bottom:6vw;
width:80vw;
right:auto;
top:auto;
transform:translate(0,0);
}
.illust_barrier1_list{
margin-top:3vw;
}
.illust_barrier1_list li{
font-size:1.1em;
}
.illust_barrier1{
width:80vw;
}
.catch_fig1_illust2{
position:relative;
margin:0 auto;
padding-bottom:6vw;
width:70vw;
right:auto;
top:auto;
transform:translate(0,0);
}
.illust_barrier2_txt{
font-size:1.1em;
width:70vw;
text-align:center;
}
.illust_barrier2{
width:70vw;
}
.catch_fig1_illust3{
position:relative;
margin:0 auto;
width:55vw;
right:auto;
top:auto;
transform:translate(0,0);
}
.illust_barrier3_txt{
margin-top:4vw;
padding-bottom:6vw;
font-size:1.1em;
}
.illust_barrier3{
width:55vw;
}
.catch_fig1_note{
margin:0 auto;
padding-bottom:8vw;
font-size:1.3rem;
line-height:1.6em;
}
} .illust_pic_list{
margin:75px auto 85px auto;
padding:0;
display:flex;
width:620px;
}
.illust_pic_list li{
margin:0 auto;
list-style:none;
vertical-align:top;
text-align:center;
width:50%;
}
.illust_pic1{
margin:0 auto;
width:124px;
}
.illust_pic2{
margin:0 auto;
padding-top:5px;
padding-bottom:7px;
width:224px;
}
.illust_pic_txt{
margin-top:30px;
font-size:15px;
line-height:22px;
font-weight: bold;
color: #9fc238;
text-align: center;
}
@media (max-width:640px){
.illust_pic_list{
margin:8vw auto 12vw auto;
width:90vw;
}
.illust_pic_list li:first-child{
width:35vw;
}
.illust_pic_list li:last-child{
width:45vw;
}
.illust_pic1{
width:20vw;
}
.illust_pic2{
padding-top:1vw;
padding-bottom:0;
width:37vw;
}
.illust_pic_txt{
margin-top:3vw;
font-size:0.9em;
line-height:1.4em;
}
} .check_ft_menu{
margin-bottom:0; padding-top:5rem;
padding-bottom:3rem;
width:100%;
background-color:#f9f9f9;
}
.check_ft_menu .footer_nav{
margin:0 auto;
width:850px;
display:flex;
flex-wrap:wrap;
}
.check_ft_menu .footer_nav li{
margin-bottom:2rem;
margin-right:30px;
width:190px;
vertical-align:top;
list-style:none;
}
.check_ft_menu .footer_nav li:nth-child(4n){
margin-right:0;
}
.check_ft_menu .item_ft_col {}
.check_ft_menu .item_ft{
margin:0 auto;
padding:0;
width:190px;
height:146px;
background-image:url(//www.kracie.co.jp/ph/k-kampo/wp-content/themes/kracie/kazelab/footer/imgs/check_menu.png);
background-repeat:no-repeat;
background-size:auto;
position: relative;
}
.check_ft_menu .item_ft:not(.with_image){
background-image: none !important;
} .check_ft_menu .item_ft img {
border-radius: 15px;
display: block !important;
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
position: absolute !important;
top: 0 !important;
left: 0 !important;
z-index: 1 !important;
} .check_ft_menu .item_ft .thumb-bottom {
border-radius: 0 0 15px 15px;
display: block !important;
position: absolute !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
height: 80px !important;
background-repeat: no-repeat !important;
background-position: center bottom !important;
background-size: 100% auto !important;
clip-path: inset(calc(100% - 36px) 0 0 0) !important;
transform: scaleY(2) !important;
transform-origin: bottom !important;
z-index: 2 !important;
}
.check_ft_menu .item_ft.item1{
background-position:top 0 left 0;
}
.check_ft_menu .item_ft.item2{
background-position:top 0 left -190px;
}
.check_ft_menu .item_ft.item3{
background-position:top 0 left -380px;
}
.check_ft_menu .item_ft.item4{
background-position:top 0 left -570px;
}
.check_ft_menu .item_ft.item5{
background-position:top -146px left 0;
}
.check_ft_menu .item_ft.item6{
background-position:top -146px left -190px;
}
.check_ft_menu .item_ft.item7{
background-position:top -146px left -380px;
}
.check_ft_menu .item_ft.item8{
background-position:top -146px left -570px;
}
.check_ft_menu .item_ft.item9{
background-position:top -292px left 0;
}
.check_ft_menu .item_ft.item10{
background-position:top -292px left -190px;
}
.check_ft_menu .item_ft.item11{
background-position:top -292px left -380px;
}
.check_ft_menu .item_ft.item12{
background-position:top -292px left -570px;
}
.check_ft_menu .item_ft.item13{
background-position:top -438px left 0;
}
.check_ft_menu .item_ft.item14{
background-position:top -438px left -190px;
}
.check_ft_menu .item_ft:hover{ opacity: 0.8;
}
.check_ft_menu .item_ft>a{
background-image:none;
}
.check_ft_menu .item_ft a{
display:block;
width:190px;
height:146px;
text-decoration: none;
}
.check_ft_menu .copy {
position: relative;
margin-left: auto;
margin-right: auto;
padding-top:75px;
font-family: 游ゴシック,YuGothic,ヒラギノ角ゴ ProN W3,Hiragino Kaku Gothic ProN,メイリオ,Meiryo,ＭＳ\ Ｐゴシック,Arial,verdana,sans-serif;
color:#000;
width:82%;
font-size:1.3rem;
line-height:1.9rem;
-webkit-transition: color .3s ease-out;
transition: color .3s ease-out;
z-index: 3;
} .check_ft_menu .copy.txt_set1{
width:87%;
font-size:1.1rem;
font-feature-settings:"palt";
}
.check_ft_menu .copy.line_two {
padding-top:85px;
}
@media (max-width:640px){
.check_ft_menu{
margin-bottom:8vw;
padding-top:8vw;
padding-bottom:4vw;
}
.check_ft_menu .footer_nav{
width:90vw; }
.check_ft_menu .footer_nav li{
width:43vw;
margin-bottom:4vw;
margin-right:4vw;
}
.check_ft_menu .footer_nav li:nth-child(2n){
margin-right:0;
}
.check_ft_menu .item_ft{
width:43vw;
height:33vw;
background-size:172vw auto;
}
.check_ft_menu .item_ft.item2{
background-position:top 0 left -43vw;
}
.check_ft_menu .item_ft.item3{
background-position:top 0 left -86vw;
}
.check_ft_menu .item_ft.item4{
background-position:top 0 left -129vw;
}
.check_ft_menu .item_ft.item5{
background-position:top -33vw left 0;
}
.check_ft_menu .item_ft.item6{
background-position:top -33vw left -43vw;
}
.check_ft_menu .item_ft.item7{
background-position:top -33vw left -86vw;
}
.check_ft_menu .item_ft.item8{
background-position:top -33vw left -129vw;
}
.check_ft_menu .item_ft.item9{
background-position:top -66vw left 0;
}
.check_ft_menu .item_ft.item10{
background-position:top -66vw left -43vw;
}
.check_ft_menu .item_ft.item11{
background-position:top -66vw left -86vw;
}
.check_ft_menu .item_ft.item12{
background-position:top -66vw left -129vw;
}
.check_ft_menu .item_ft.item13{
background-position:top -99vw left 0;
}
.check_ft_menu .item_ft.item14{
background-position:top -99vw left -43vw;
}
.check_ft_menu .item_ft a{
width:43vw;
height:33vw;
}
.check_ft_menu .copy {
padding-top:17.5vw;
width:38vw;
}
.check_ft_menu .copy.line_two {
padding-top:19vw;
}
}