@charset "UTF-8";
 .note_production_finished{
position: relative;
display: block;
padding-bottom: 15px;
font-size: 12px;
line-height: 1.4;
color: #ff0000;
text-align: center;
} .sec_position{
position: absolute;
pointer-events: none;
width: 1px;
height: 1px;
top: -140px;
left: 0;
opacity: 0;
} .mod-item-list{
display: flex;
flex-wrap: wrap;
}
.mod-intro .mod-intro-inner{
height:100px;
background:url(//www.kracie.co.jp/ph/k-kampo/wp-content/themes/kracie/assets/img/common/bg-intro2.png) center 0 no-repeat;
}
.mod-intro .mod-intro-inner h1{
position:absolute;
top:36px;
left:0;
}
.body-sec .sec-inner{
width:950px;
margin:0 auto;
}
@media (max-width:769px) {
.mod-intro img{
height:100%;
width:auto;
}
.mod-intro-inner{
width:100%;
}
.mod-intro .mod-intro-inner{
height:80px;
background-position:right 0 center;
background-size:cover;
}
.mod-intro .mod-intro-inner h1{
height:20px;
width:auto;
top:29px;
left:20px;
}
.body-sec .sec-inner{
width:100%;
}
}
.body-sec .banner-sec{width:680px;margin:40px auto 0}
.body-sec .banner-sec ul{margin-left:-40px}
.body-sec .banner-sec ul:before,.body-sec .banner-sec ul:after{content:"";display:table}
.body-sec .banner-sec ul:after{clear:both}
.body-sec .banner-sec ul li{float:left;margin-left:40px}
.body-sec .banner-sec ul li a:hover{transition:opacity .2s}
.body-sec .banner-sec ul li a:hover:hover{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=75);opacity:0.75}
@media (max-width:769px) {
.body-sec .banner-sec{
width:90%;
margin:30px auto 0;
}
.body-sec .banner-sec ul{
width:100%;
margin:0;
clear:both;
}
.body-sec .banner-sec ul li{
float:none;
margin-left:0;
margin-bottom:20px;
text-align:center;
}
.body-sec .banner-sec ul li img{
width:100%;
}
} .contents-sec{
position: relative;
margin-top: 50px;
}
.contents-sec .sec-inner{
padding-bottom:50px;
border-bottom:1px solid #e1e1e1;
}
.contents-sec .catch{font-size:1.28571em;font-weight:bold}
.contents-sec .title{
margin-bottom:15px;
font-size:1.71429em;
font-weight:bold;
font-feature-settings: "palt";
}
.contents-sec .catch span,.contents-sec .title span{position:relative;top:-2px;margin-left:10px;padding:2px 5px;border:1px solid #999;color:#666;font-weight:normal;font-size:10px}
.contents-sec .label:before,.contents-sec .label:after{content:"";display:table}
.contents-sec .label:after{clear:both}
.contents-sec .label dt{
position: relative;
float:left;
margin-right:20px;
padding: 0 10px;
font-size: 12px;
font-weight: bold;
color: #fff;
text-align: center;
line-height: 26px;
border-radius: 2px;
}
.contents-sec .label dd{
font-size: 14px;
line-height: 26px;
}
.contents-sec#sec1 .catch,.contents-sec#sec1 .title{color:#ed4c00}
.contents-sec#sec1 .label dt{background-color:#ed4c00}
.contents-sec#sec1 .label dd{color: #ed4c00;}
.contents-sec#sec2 .catch,.contents-sec#sec2 .title{color:#00a8e4}
.contents-sec#sec2 .label dt{background-color:#00a8e4}
.contents-sec#sec3 .catch,.contents-sec#sec3 .title{color:#00b77c}
.contents-sec#sec3 .label dt{background-color:#00b77c}
.contents-sec#sec4 .catch,.contents-sec#sec4 .title{color:#a914d8}
.contents-sec#sec4 .label dt{background-color:#a914d8}
.contents-sec#sec5 .catch,.contents-sec#sec5 .title{color:#cc9500}
.contents-sec#sec5 .label dt{background-color:#cc9500}
.contents-sec#sec6 .catch,.contents-sec#sec6 .title{color:#98c900}
.contents-sec#sec6 .label dt{background-color:#98c900}
.contents-sec#sec7 .catch,.contents-sec#sec7 .title{color:#0061c5}
.contents-sec#sec7 .label dt{background-color:#0061c5}
.contents-sec#sec8 .catch,.contents-sec#sec8 .title{color:#eb0032}
.contents-sec#sec8 .label dt{background-color:#eb0032}
.contents-sec#sec9 .catch,.contents-sec#sec9 .title{color:#07b300}
.contents-sec#sec9 .label dt{background-color:#07b300}
.contents-sec#sec10 .catch,.contents-sec#sec10 .title{color:#258c02}
.contents-sec#sec10 .label dt{background-color:#258c02}
.contents-sec#sec11 .catch,.contents-sec#sec11 .title{color:#ba4c91}
.contents-sec#sec11 .label dt{background-color:#ba4c91} .contents-sec#sec12 .catch,.contents-sec#sec12 .title{color:#0f867f}
.contents-sec#sec12 .label dt{background-color:#0f867f}
.mod-item-list .type12 .caption dt{color:#0f867f}
@media (max-width:769px) {
.contents-sec{
margin:30px auto 0 auto;
width: 90%;
text-align: left;
}
.contents-sec .sec-inner{
padding-bottom:40px;
}
.contents-sec .catch{
font-size:12px;
}
.contents-sec .title{
padding-top:5px;
font-size: 1.2rem;
}
.contents-sec .catch span,.contents-sec .title span{
top:0;
}
.contents-sec .label dt{
float: none;
margin-right: 0;
margin-bottom: 10px;
padding: 10px 0;
font-size: 0.9rem;
line-height: 1;
height: auto;
width: 100%;
}
.contents-sec .label dt img{
height:100%;
width:auto;
}
.contents-sec .label dd{
font-size: 0.9rem;
}
.mod-item-list li{
margin-top:10px;
margin-right:10px;
vertical-align:top;
width: 48.27586%;
min-height: 182px;
}
.mod-item-list li:nth-child(even){
margin-right:0;
margin-left:0;
}
.mod-item-list li:nth-child(5n){ }
.mod-item-list li a{
width:auto;
}
.mod-item-list li .figure img {
width: 110px;
}
.mod-item-list .type1 .caption dt{
font-size:12px;
}
.mod-item-list li a .caption dd{
font-size:11px;
}
}
.search-sec{
height:50px;
background:#eeeeee;
}
.search-sec .btn-search{width:119px;padding-top:17px;margin:0 auto}
.search-sec .btn-search a{
display:block;width:119px;height:16px;
overflow:hidden;
font-size:0;text-indent:100%;white-space:nowrap;outline:none;
background-image:url(//www.kracie.co.jp/ph/k-kampo/wp-content/themes/kracie/assets/img/lineup/btn-search.png);
background-repeat:no-repeat;
background-position:0 0;
background-size:100% auto;
}
.search-sec .btn-search a:hover{transition:opacity .2s}
.search-sec .btn-search a:hover:hover{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=75);opacity:0.75}
.search-sec .btn-search.up a{background-image:url(//www.kracie.co.jp/ph/k-kampo/wp-content/themes/kracie/assets/img/lineup/btn-search-o.png)}
.search-contents-sec{background:#e6e6e6;display:none}
.search-contents-sec .search-nav-sec{margin:0 auto;padding:20px 0;text-align:center}
.search-contents-sec .search-nav-sec:before,.search-contents-sec .search-nav-sec:after{content:"";display:table}
.search-contents-sec .search-nav-sec:after{clear:both}
.search-contents-sec .search-nav-sec li{
display:inline-block;
margin:0 10px 0 0;
line-height:0;
width:86px;
}
.search-contents-sec .search-nav-sec li:last-child{
margin-right:0;
}
.search-contents-sec .search-nav-sec li a{
display:block;
width: 100%;
padding:3px 0;
border-radius: 25px;
border: 1px solid #fff;
background: #fff;
text-align: center;
color: #ff6666;
text-decoration: none;
font-size:15px;
font-weight: bold;
}
.search-contents-sec .search-nav-sec li a:hover{transition:opacity .2s}
.search-contents-sec .search-nav-sec li a:hover:hover{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=75);opacity:0.75}
.search-contents-sec .search-nav-sec li a span {
vertical-align: middle;
}
@media (max-width:769px) {
.search-sec .btn-search{
padding-top:0;
width:100%;
height:50px;
text-align: center;
}
.search-sec .btn-search a{
width:100%;
height:50px;
background-size:100px auto;
background-position:center;
}
.search-sec .btn-search a:hover:hover{
opacity:1!important;
}
.search-contents-sec .search-nav-sec{
margin:0;
padding:15px 0;
width:100%;
}
.search-contents-sec .search-nav-sec li{
margin:0 5px 10px 0;
width:45%;
text-align:center;
}
.search-contents-sec .search-nav-sec li:nth-child(even){
margin-right:0;
}
.search-contents-sec .search-nav-sec li:last-child{
margin-bottom:0;
}
.search-contents-sec .search-nav-sec li a{
display:block;
width: 100%;
padding:10px 0;
border-radius: 25px;
border: 1px solid #fff;
background: #fff;
text-align: center;
color: #ff6666;
text-decoration: none;
font-size:12px;
font-weight: bold;
}
}