<style>
/*前頁共通*/
article {
 padding-top: 30px; 
}
body{
 border-top:7px solid #dce775 !important;
 border-bottom:7px solid #dce775 !important;
} 
h1 .logo {
 display:block;
 background-image: url(http://katsura-keiko-tfp.com/kktfp/image/PClogo.png);
 background-repeat: no-repeat;
 background-size:100%;
 height:140px; width: 140px;
 margin: 0 auto;
}
h3 {
 font-family: 'Spinnaker', sans-serif;
 width: 360px;
 height: 102px;
 padding:45px 130px 25px 0px;
 margin: 10px auto 15px;
 background-image: url(http://katsura-keiko-tfp.com/kktfp/image/h3_line.png);
 background-repeat: no-repeat;
 background-size: 100%;
 text-align:center;
}
h5 {
 font-family: 'Spinnaker', sans-serif;
 width: 250px;
 height: 50px;
 margin: 30px auto 20px;
 padding-bottom:25px;
 background-image: url(http://katsura-keiko-tfp.com/kktfp/image/h5_line.png);
 background-repeat: no-repeat;
 background-size: 100%;
 background-position: 0px 20px;
 text-align:center;
}
h6{
 color: #337ab7;
 margin-bottom:25px;
}
footer p {
 text-align: center;
 margin: 5px 0 5px;
 font-size:12px;
}

#Carousel,#big_img{
 margin-right:-15px;
 margin-left:-15px;
 background:url(http://katsura-keiko-tfp.com/kktfp/image/slide_bg.png) repeat;
}
#big_img img {
 margin: 0 auto;
 line-height: 1;
 display: block;
 max-width: 100%;
 height: auto;
 vertical-align: middle;
 border: 0;
}	

.bg_white{
 background-color:#FFFEF7;
} 
.banner {
 width:300px;
 height:250px;
 margin-top:15px;
}
.carousel-inner>.item>img{
 margin:0 auto;
}
.img360_222{
 width:360px;
 height:222px;
}
.img222_296{
 width:222px;
 height:296px;
}
.img300_185{
 display:block;
 width:300px;
 height:185px;
 float:left;
 margin-right:20px;
}
.jpn_title{
 font-size:18px;
 font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ','ＭＳ Ｐゴシック' !important;
}
.navbar-nav>li{
 float:none;
} 
.navbar-nav{
 float:none;
} 
.nav-pills a{
 color:#535353;
 background-color: rgba(220, 231, 117, 0.33);
 margin-right: 5px;
}
.pickup_box img{
 display:block;
 width:100%;
 height:auto;
}
.pickup_box h6{
 height:2em;
}
.pankuzu{
 font-size:10px;
 padding-top:5px;
 margin-bottom:10px;
}
.ribon_ue {
 background-image: url(http://katsura-keiko-tfp.com/kktfp/image/ribon_ue.png);
 margin-bottom:10px;
}
.ribon_sita {
 background-image: url(http://katsura-keiko-tfp.com/kktfp/image/ribon_sita.png);
 margin-top:20px;
}
.ribon_ue,.ribon_sita{
 background-repeat: repeat-x;
 height: 40px;
 background-size: contain;
}
.mediaCM {
 width:90%;
 padding:20px;
 margin:10px auto 30px;
 border:2px dotted #e9ebee;
}
.mediaCM>p {
 color:#777777;
}
.mediaCM>dl>dt {
 color:#ff9800;
}
#top{position: fixed;bottom: 30px;right: 10px;}
#top a{opacity:0.7;}
#top a:hover{opacity:1;}
#top svg{width:50px; height:50px;}



/*トップページ*/
.blog_box {
 background-color: #fff;
 height: 300px;
 width:80%;
 overflow-y: scroll;
 margin: 10px auto 30px;
 padding: 10px;
 border:1px solid #e9ebee;
 border-radius: 5px; 
}
.blog_box .info_date{
 float:left;
 width:200px;
}
.info_box{
 margin: 0px auto 30px;
 width:80%; 
}
.info_box a,.blog_box a{
 color:#535353;
}
.info_box .info_date{
 width:200px;
 float:left;
}
.menubox {
 background-color: #FFFEF7;
 box-shadow: 1px 1px 1px rgba(0,0,0,0.1);
 border:1px solid #e9ebee;
 border-radius: 5px;
 margin-bottom:10px;  
 flex-basis:22%;
 display: flex;
 flex-flow: column;
}
.menubox_cont{
 margin-top: 20px;
 display: flex;
 flex-flow:row wrap;
 justify-content:space-around;
 align-items：stretch;
 align-content：center; 
}
.menubox img{
 width:100%;
 height:auto;
 border-top-left-radius:5px;
 border-top-right-radius:5px;
}
.menubox h4 {
 padding: 2px 12px;
}
.menubox p {
 padding: 12px;
 border-top: 1px solid #e9ebee;
 line-height: 1.2em; 
 margin-bottom: -2px;
}
.menubox  a{
 margin-right: 8px;
 margin-left:8px;
}
.menubox>.kuwasiku_btn{
 margin-top:auto;
 padding-bottom:8px;
}

.osirase,.diary,.line_up,.column,.school,.cooking,.talk_media,.books_goods {
 display: inline;
 padding: .2em .6em .3em;
 font-size: 75%;
 font-weight: bold;
 line-height: 1;
 color: #fff;
 text-align: center;
 white-space: nowrap;
 vertical-align: baseline;
 border-radius: .25em;
 margin-left:20px;
}
.osirase,.diary{
 background-color: #d9534f;
} 
.line_up,.column{
 background-color: #5cb85c;
}
.school,.cooking{
 background-color: #f0ad4e;
}
.talk_media,.books_goods{
 background-color: #337ab7;
}
.osirase:after {
 content:"お知らせ";
}
.diary:after {
 content:"今日の出来事";
}
.line_up:after {
 content:"書籍・商品";
}
.column:after {
 content:"日々の雑感";
}
.school:after {
 content:"料理教室";
}
.cooking:after {
 content:"お料理";
}
.talk_media:after {
 content:"講演・メディア";
}
.books_goods:after {
 content:"本・商品";
}



/*プロフページ*/
.company_list_style>li{
 margin-left:10px;
}
.media_box {
 height: 300px;
 width:90%;
 overflow-y: scroll;
 margin: 10px auto 30px;
 padding:20px;
 border:1px solid #e9ebee;
 border-radius: 5px;
 background-color:#FFFEF7;
}
.prof_table {
 width:90%;
 margin:20px auto;
}
.prof_table tr,.prof_table th,.prof_table td{
 border-top-color:#FFFEF7 !important;
}
.prof_table th{
 width:20%;
 border-right:1px solid #e9ebee;
 text-align:center;
}
.prof_table td{
 padding-left: 20px !important;
}



/* 商品ページ */
article .catchcopy {
 margin-top: 10px;
 color: #FF9800; 
}
article img {
 width: 100%;
 max-width: 320px;
 height: auto;
 display: block;
 margin:0 auto;
 border-radius: 6px; 
}
article .name {
 padding-bottom: 9px;
 margin: 20px 0 20px;
 border-bottom: 2px solid #cacaca; 
}
article .price {
 font-size: 18px;
 color: #FFC107; 
}
article ul,article ol {
 padding-left: 10px; 
}
.itembox {
 background-color: #FFFEF7;
 box-shadow: 2px 2px 1px rgba(0,0,0,0.1);
 border-radius: 5px;
 margin-top: 20px;
 padding-top: 0;
}
.itembox a,.itembox a:hover {
 text-decoration: none; 
}
.itembox img {
 width: 100%;
 height:auto;
 border-top-left-radius: 5px;
 border-top-right-radius: 5px; 
 border-bottom-left-radius: 0;
 border-bottom-right-radius: 0; 
}
.itembox-name {
 overflow: hidden;
 position: relative;
 height: 3.1em;
 word-break: break-word;
 font-size: 16px;
 color: #337ab7; 
}
.itembox-name:after {
 display: block;
 content: '';
 position: absolute;
 bottom: 0;
 right: 0;
 width: 50%;
 height: 1em;
 background: linear-gradient(to right, rgba(255,254,247,0), #fffef7 72%);
}
.itembox-body {
 padding: 0 16px; height: 90px; 
}
.itembox-price {
 font-size: 14px; color: #535353; 
}
.long-img {
 width: 70%;
 height: auto; 
}
.long-img>p{
 line-height:1em; 
}
.lineup_link_btn {
 padding-top: 15px; 
}




/*各ブログ*/
.blogpagination {
 width: 330px;
 margin: 30px auto;
 text-align: center; 
}
.blogpagination a {
 font-size: 16px;
 color: #535353;
 text-decoration: none;
 padding: 4px 12px;
 margin-right: 2px;
 border: 1px solid #dce775;
 border-radius: 3px; 
}
.blogpagination p {
 color: #535353;
 font-size: 12px; 
}
.current_page_number {
 background-color: #dce775 !important; 
}
.infoblog_box {
 font-size: 16px;
 padding-top: 20px;
 margin: 0 auto; 
}
.infoblog_box .infoblog_date {
 width: 300px;
 float: left; 
}
.infoblog_box li {
 padding-top: 7px;
 border-bottom: 1px solid #e9ebee; 
}
.infoblog_box a {
 color:#535353; 
}
.myblog h2,.myblog h4 {
 margin-top: 10px; 
}
.myblog .blog_thumb{
 max-width:300px;
 height:auto; 
}
.myblog .blog_date {
 border-top: solid 1px #e9ebee;
 padding-top: 6px;
 margin-bottom:30px;
 font-family: 'Spinnaker', sans-serif; 
}
.pager{
 width:100%;
 margin:0 auto 30px;
}
.pager>a{
 display:inline-block;
 width:30%;
}
.sns_btn {
 display: inline-flex;
 margin-top: 15px;
 text-align: right; 
}
.tuduki_btn{
 width:140px;
 display:block;
 margin:0 auto;
 padding-bottom:8px;
}



/*メディアクエリ*/
@media (min-width:992px) and (max-width:1199px){.navbar-nav>li>a {padding-top: 6px;padding-bottom: 6px;}}
@media (min-width:768px) and (max-width:1180px){.logo{margin-top:0;}}
@media (max-width:1180px){.menubox h4{font-size:18px;}h1{ margin-top:0px; margin-bottom:0px;} h1 .logo{	background-image: url(http://katsura-keiko-tfp.com/kktfp/image/MBlogo.png); width: 107px; height:107px;}}
@media (max-width:991px) {.itembox-body { padding: 0 10px;}}
@media (max-width:767px) {.navbar { margin-bottom:0px !important;} .info_box .info_date, .blog_box .info_date,.infoblog_box .infoblog_date { float:none;} .ribon_ue,.ribon_sita{ height:30px; background-size:62px 30px;}.big-pan-img{width:100%;}.img300_200{ float:none; margin-right:auto; margin-left:auto;}.pager>a{display:inline-block; width:33%;}.menubox{ flex-basis:47%;}.long-img { width: 90%;}}
@media (max-width:435px){ h3 {width: 320px; height: 91px; padding:40px 120px 25px 0px;} h5 {width: 220px; height: 45px; margin: 30px auto 18px; padding-bottom:22px;background-position: 0px 18px;} .blog_box {width:320px;} .ribon_ue,.ribon_sita{ height:20px; background-size:41px 20px;}.prof_table{width:100%; margin:20px 0;}.prof_table th{width:30%;}.img300_185 { float: none; margin-right: auto; margin-left: auto; }.menubox h4 {padding: 2px 7px;}.menubox p {padding: 7px;}}
</style>