@charset "UTF-8";

.pcnone
{
    display: none !important;
}
.spnone
{
}

body {
}

a:focus {
    outline: none;
}

#wrapper {
    min-width: 994px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/*------------------------------
上部ログイン情報
------------------------------*/

.login_top
{
    background-color: #7f3c1b;
    width: 964px;
    margin: 0 auto;
}

.login_top ul.login_top_left
{
    font-size:0;
    float: left;
}
.login_top ul.login_top_left li
{
    display:inline-block;
    vertical-align: top;
    text-align: left;
    font-size:11px;
    color:#ffffff;
    padding:22px 20px 22px 20px;
    line-height:1;
}
.login_top ul.login_top_left li:nth-child(2)
{
    background:url(../img/v4/login_iconline.png) left no-repeat;
}

.login_top ul.login_top_right
{
    font-size:0;
    float: right;
}
.login_top ul.login_top_right li
{
    display:inline-block;
    vertical-align: top;
}
.login_top ul.login_top_right li:nth-child(1)
{
    background:url(../img/v4/login_iconline.png) left no-repeat;
}
.login_top ul.login_top_right li:nth-child(2)
{
    background:url(../img/v4/login_iconline.png) left no-repeat;
}
.login_top ul.login_top_right li:nth-child(3)
{
    background:url(../img/v4/login_iconline.png) left no-repeat;
}
.login_top ul.login_top_right li:nth-child(4)
{
    background:url(../img/v4/login_iconline.png) left no-repeat;
}
.login_top ul.login_top_right li:nth-child(5)
{
    border-left: #9a461c 1px solid;
}
.login_top ul.login_top_right li a
{
    font-size:11px;
    color:#ffffff;
    display:block;
    margin: 0;
    padding:22px 18px 22px 43px;
    line-height:1;
}
.login_top ul.login_top_right li:nth-child(1) a
{
    background:url(../img/v4/login_icon1.png) 18px no-repeat;
}
.login_top ul.login_top_right li:nth-child(2) a
{
    background:url(../img/v4/login_icon2.png) 18px no-repeat;
}
.login_top ul.login_top_right li:nth-child(3) a
{
    background:url(../img/v4/login_icon3.png) 18px no-repeat;
}
.login_top ul.login_top_right li:nth-child(4) a
{
    background:url(../img/v4/login_icon4.png) 18px no-repeat;
}
.login_top ul.login_top_right li:nth-child(5) a
{
    padding:22px 18px 22px 18px;
}
.login_top ul.login_top_right li a:hover
{
    background-color: #996349;
}

/*------------------------------
ヘッダー
------------------------------*/

header
{
    width: 964px;
    margin: 0 auto;
}

header .inner1
{
    min-width: 964px;
    background-color: #dde7ce;
}
header .inner1 h1
{
    float: left;
    font-size:12px;
    color:#000000;
    line-height:1;
    font-weight: normal;
    padding:11px 0px 0px 20px;
}

header .inner1 ul.inner1_right
{
    font-size:0;
    float: right;
}
header .inner1 ul.inner1_right li
{
    display:inline-block;
    vertical-align: middle;
}
header .inner1 ul.inner1_right li a
{
    font-size:12px;
    font-weight: bold;
    color:#7f3c1b;
    display:block;
    line-height:1;
}
header .inner1 ul.inner1_right li.inner1_btn {
    height: 32px;						/* 36->32 yoko */
    width: 160px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
header .inner1 ul.inner1_right li.inner1_btn a {
    background-color: #ffaf23;
    background-position: 18px center;
    background-repeat: no-repeat;
    color: #fff;
    width: 100%;
    height: 100%;
    padding-left: 42px;
    line-height: 32px;					/* 36->32 yoko */
    font-size: 14px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
header .inner1 ul.inner1_right li.btn_q {
    border-right: 1px solid #eb9d13;
}
header .inner1 ul.inner1_right li.btn_q a {
    background-image: url(../img/v4/icon_question.png);
}
header .inner1 ul.inner1_right li.btn_s a {
    background-image: url(../img/v4/icon_sitemap.png);
}
header .inner1 ul.inner1_right li:nth-child(1) a
{
    margin-right: 15px;
}
header .inner1 ul.inner1_right li a:hover
{
    opacity:0.8;
}

header .inner2
{
    position:relative;
    width:964px;
    height:68px;						/* 80->68 yoko */
    margin:0 auto;
}
header .inner2 .header-logo1
{
    position:absolute;
    top:12px;							/* 18->12 yoko */
    left:20px;
}
header .inner2 .header-logo2
{
    position:absolute;
    top:16px;							/* 22->16 yoko */
    left:380px;
}
header .inner2 ul.inner2_right
{
    font-size:0;
    float: right;
    margin-top: 16px;					/* 22->16 yoko */
}
header .inner2 ul.inner2_right li
{
    display:inline-block;
    vertical-align: middle;
}
header .inner2 ul.inner2_right li:nth-child(1) input
{
/*    width: 200px;						yoko */
    border: #ebebeb 1px solid;
    padding: 8px 10px 8px 10px;
    margin-right: 5px;
    border-radius:5px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
}
header .inner2 ul.inner2_right li a:hover
{
    opacity:0.8;
}
header .inner2 ul.inner2_right .btn_search {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    background-color: transparent;
    font-size: 0;
    display: block;
    width: 72px;
    height: 36px;
    background: url(../img/v4/btn_kensaku.png) 0 0 no-repeat;
}

/*------------------------------
グローバルナビ
------------------------------*/

nav
{
    width: 964px;
    margin:0 auto;
    position:relative;
    z-index:10;
}
nav ul
{
    width: 964px;
    margin:0 auto;
    background-color: #476a0d;
    letter-spacing: -.4em;
}
nav ul li
{
    text-align:center;
    display:inline-block;
    vertical-align: middle;
    width:25%;
    letter-spacing: normal;
}
nav ul li:nth-child(2)
{
    background:url(../img/v4/nav_line.png) left no-repeat;
}
nav ul li:nth-child(3)
{
    background:url(../img/v4/nav_line.png) left no-repeat;
}
nav ul li:nth-child(4)
{
    background:url(../img/v4/nav_line.png) left no-repeat;
}
nav ul li a
{
    display:block;
    margin: 0;
    padding: 17px 0px 17px 0px;
    line-height:1;
    color: #fff;
    font-size: 16px;
}
nav ul li a:hover
{
    background-color: #6c883d;
}

/*------------------------------
ページトップ
------------------------------*/

.pagetop
{
display:none;
position:fixed;
bottom:30px;
right:40px;
}

/*------------------------------
フッター
------------------------------*/

footer
{
    clear: both;
}

#banner5
{
    width: 964px;
    margin: 40px auto;
    text-align: center;
}
#banner5 img
{
}
#banner5 img:hover
{
    opacity:0.8;
}

.menseki
{
    background-color: #ffffff;
}
.menseki .inner {
    width: 964px;
    margin: 0 auto;
}
.menseki h2
{
    font-size:13px;
    font-weight: bold;
    letter-spacing: 1px;
    color:#000000;
    padding:20px 0 2px 0;
    line-height:1.8;
    text-align: left;
}
.menseki p
{
    max-width: 1140px;
    margin: 0 auto;
    font-size:11px;
    letter-spacing: 1px;
    color:#000000;
    padding:0px 0 30px 0;
    line-height:1.8;
    text-align: left;
    border-bottom: #dfe4d7 1px solid;
}

.footer-box
{
    background-color: #ffffff;
}

.footer-box .inner
{
    width: 964px;
    margin: 0 auto;
    padding: 30px 0;
}

.footer-box .inner .footer-logo
{
    width: 228px;
    float: left;
}
.footer-box .inner .footer-logo img {
    max-width: 90%;
}

.footer-box .inner .footer-menu1
{
    width: 185px;
    float: left;
}
.footer-box .inner .footer-menu1 ul
{
    font-size:0;
}
.footer-box .inner .footer-menu1 ul li
{
    display: block;
    font-size:12px;
    letter-spacing: 1px;
    color:#7f3c1b;
    line-height:1.6;
    text-align: left;
    margin: 0 0 10px 0;
}
.footer-box .inner .footer-menu1 ul li a
{
    color:#7f3c1b;
}
.footer-box .inner .footer-menu1 ul li a:hover
{
    color:#7f3c1b;
    text-decoration:underline;
}

.footer-box .inner .footer-menu2
{
    width: 202px;
    float: left;
}
.footer-box .inner .footer-menu2 ul
{
    font-size:0;
}
.footer-box .inner .footer-menu2 ul li
{
    display: block;
    font-size:12px;
    letter-spacing: 1px;
    color:#7f3c1b;
    line-height:1.6;
    text-align: left;
    margin: 0 0 10px 0;
}
.footer-box .inner .footer-menu2 ul li a
{
    color:#7f3c1b;
}
.footer-box .inner .footer-menu2 ul li a:hover
{
    color:#7f3c1b;
    text-decoration:underline;
}

.footer-box .inner .footer-menu3
{
    width: 180px;
    float: left;
}
.footer-box .inner .footer-menu3 ul
{
    font-size:0;
}
.footer-box .inner .footer-menu3 ul li
{
    display: block;
    font-size:12px;
    letter-spacing: 1px;
    color:#7f3c1b;
    line-height:1.6;
    text-align: left;
    margin: 0 0 10px 0;
}
.footer-box .inner .footer-menu3 ul li a
{
    color:#7f3c1b;
}
.footer-box .inner .footer-menu3 ul li a:hover
{
    color:#7f3c1b;
    text-decoration:underline;
}

.footer-box .inner .footer-sns
{
    width: 140px;
    float: right;
}
.footer-box .inner .footer-sns ul
{
    font-size:0;
}
.footer-box .inner .footer-sns ul li
{
    display: block;
    font-size:12px;
    color:#7f3c1b;
    line-height:1.6;
    text-align: left;
    margin: 0 0 20px 0;
}
.footer-box .inner .footer-sns ul li:nth-child(1)
{
    display: block;
    font-size:12px;
    color:#7f3c1b;
    font-weight: bold;
    line-height:1.6;
    text-align: left;
    margin: 0 0 15px 0;
    padding-bottom: 8px;
    border-bottom: #dfe4d7 1px solid;
}
.footer-box .inner .footer-sns ul li img
{
    display: inline-block;
    vertical-align: middle;
    margin: 0 10px 0 0;
}
.footer-box .inner .footer-sns ul li a
{
    color:#7f3c1b;
}
.footer-box .inner .footer-sns ul li a:hover
{
    color:#7f3c1b;
    text-decoration:underline;
}

.copyright
{
    border-top: #dfe4d7 1px solid;
    text-align:center;
    font-size:10px;
    color:#666666;
    padding:20px 0 20px 0;
    background-color:#ffffff;
}

.sp_footer
{
    display: none;
}
.sp_footer img
{
    width: 100%;
    height: auto;
}

/*------------------------------
メインビジュアル
------------------------------*/

#main-visual
{
    width: 964px;
    height: 200px;
    margin: 0 auto;
}
#main-visual .inner
{
    position:relative;
    height: 100%;
    background: url(../img/v4/mainvisual_bg.png) 0 0 no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
}
#main-visual .logo02 {
    position: absolute;
    top: 34px;
    left: 42px;
}
#main-visual .main-copy {
    position: absolute;
    top: 22px;
    left: 607px;
}
#main-visual .inner .btn {
    position: absolute;
    top: 119px;
    left: 607px;
    display: block;
    width: 320px;
    height: 56px;						/* 66->56 yoko */
}
#main-visual .inner .btn a {
    position: relative;
    width: 100%;
    height: 100%;
    display: block;
    color: #fff;
    line-height: 56px;					/* 66->56 yoko */
    font-size: 22px;
    text-align: center;
    background: url(../img/v4/btn_bg02.png) 0 0 no-repeat;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
}
#main-visual .inner .btn a .txt {
    color: #fff;
    font-weight: bold;
}
#main-visual .inner .btn img:hover
{
    opacity:0.8;
}
#main-visual .inner .main-item {
    position: absolute;
    top: 41px;							/* 10->41 yoko */
    left: 350px;						/* 324->350 yoko */
}
#main-visual img.pc
{
}
#main-visual img.sp
{
    display: none;
}
#main-visual img
{
    display:block;
    margin:0 auto;
}

/*------------------------------
コンテンツ
------------------------------*/

#content
{
    position:relative;
    width: 964px;
    margin:20px auto 0 auto;
}

#leftbox
{
    float: left;
    width: 692px;
}

#rightbox
{
    float: right;
    width: 240px;
}

/*------------------------------
トップ - お知らせ
------------------------------*/

#news
{
}

#news h2
{
    margin-top: 10px;
    margin-bottom: 20px;
    padding-left: 10px;
    border-left: 3px solid #ffaf23;
    line-height:1.2;
    text-align:left;
    font-size: 16px;
}
#news h2 span
{
    float: right;
    display: inline-block;
    font-size: 12px;
    letter-spacing: .05em;
}
#news h2 span a {
    display: block;
    padding-left: 12px;
    padding-right: 12px;
    padding-bottom: 5px;
    border-bottom: 2px solid #7f3c1b;
}
#news h2 span a:hover
{
    opacity:0.8;
}

.news-list
{
    width:100%;
    background-color: #ffffff;
}
.news-list ul
{
}
.news-list ul li
{
/*    padding:15px 20px 15px 20px;		yoko */
    padding:10px 20px 10px 20px;		/* yoko leftright 10->20*/
    line-height:1.6;
    font-size:13px;
}
.news-list ul li span
{
}
.news-list ul li span.date
{
    float:left;
/*    width:19em;							/* 7->19 yoko2018 for 2colomn */
    width:7em;
    color:#000000;
}
.news-list ul li span.text
{
    float:right;
/*    width:calc(100% - 20em);			/* 9-20 yoko2018 for 2colomn */
    width:calc(100% - 8em);			/* 8->2->9->13->8 yoko */
    color:#7f3c1b;
}
.news-list ul li span.text a
{
    color:#7f3c1b;
}
.news-list ul li span.text a:hover
{
    color:#7f3c1b;
    text-decoration:underline;
}

/*------------------------------
トップ - カロリー計算をする
------------------------------*/

#calorie
{
    margin-top: 15px;					/* 30->15 yoko */
}

#calorie h2
{
    padding-bottom: 20px;
    line-height:1;
    font-weight:normal;
    text-align:left;
}
#calorie h2 a {
    display: block;
    background: #ffaf23 url(../img/v4/arrow01.png) 18px center no-repeat;
    -moz-box-shadow:0px 1px 0px 0px #ffdd23 inset;
    -webkit-box-shadow:0px 1px 0px 0px #ffdd23 inset;
    box-shadow:0px 1px 0px 0px #ffdd23 inset;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
    border:1px solid #eb9d13;
    height: 50px;
    font-size: 18px;
    padding-left: 50px;
    line-height: 50px;
    color: #fff;
    font-weight: bold;
}
#calorie h2 a:hover
{
    opacity:0.8;
}
#calorie ul
{
    font-size:0;
    margin-left: -4px;
    margin-right: -4px;
    letter-spacing: -.4em;
}
#calorie ul li
{
    display:inline-block;
    vertical-align: top;
    width: calc(96% / 6);				/* 100->96 yoko */
    margin-bottom: 15px;
    padding-left: 14px;					/* 4->14 yoko */
    padding-right: 4px;
    letter-spacing: normal;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#calorie ul li .img {
    position: relative;
}
#calorie ul li img {
    width: 100%;
}
#calorie ul li .mark
{
    position: absolute;
    bottom: 0;
    right: 0;
}
#calorie ul li p
{
    font-size:13px;
    letter-spacing: 1px;
    color:#7f3c1b;
    padding:10px 0px 0px 0px;
    line-height:1.6;
    text-align: center;
}
#calorie ul li a:hover
{
    opacity:0.8;
}

/*------------------------------
トップ - グラムのわかる写真館
------------------------------*/

#photo
{
    position: relative;
    margin-top: 10px;
}

#photo h2
{
    padding-bottom: 20px;
    line-height:1;
    font-weight:normal;
    text-align:left;
}
#photo h2 a {
    display: block;
    background: #ffaf23 url(../img/v4/arrow01.png) 18px center no-repeat;
    -moz-box-shadow:0px 1px 0px 0px #ffdd23 inset;
    -webkit-box-shadow:0px 1px 0px 0px #ffdd23 inset;
    box-shadow:0px 1px 0px 0px #ffdd23 inset;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
    border:1px solid #eb9d13;
    height: 50px;
    font-size: 18px;
    padding-left: 50px;
    line-height: 50px;
    color: #fff;
    position: relative;
    font-weight: bold;
}
#photo h2 a:hover
{
    opacity:0.8;
}
#photo h2 a .s {
    position: absolute;
    right: 20px;
    top: 0;
    font-size: 13px;
    color: #fff;
    font-weight: normal;
}
#photo-thumbs {
    margin-left: auto;
    margin-right: auto;
    width: 565px;
    margin-bottom: 15px;
}
#photo ul
{
    font-size:0;
    margin-left: auto;
    margin-right: auto;
    width: 565px;
}
#photo ul li
{
    text-align: center;
}
#photo ul li p
{
    font-size:13px;
    letter-spacing: 1px;
    color:#7f3c1b;
    padding:10px 0px 0px 0px;
    line-height:1.6;
    text-align: center;
    /*display: none;*/
}
#photo ul li a {
    display: block;
    position: relative;
    width: 105px;
    height: 66px;
}
#photo ul li a:hover
{
    opacity:0.8;
}
#photo ul li a img {
    width: 100%;
}
#photo .swiper-button {
    top: 60%;
    width: 36px;
    height: 36px;
}
#photo .swiper-button:hover {
    opacity: .75;
}
#photo .swiper-button-prev {
    background-image: url(../img/v4/arrow02_l.png);
    -webkit-background-size: 100%;
    background-size: 100%;
}
#photo .swiper-button-next {
    background-image: url(../img/v4/arrow02_r.png);
    -webkit-background-size: 100%;
    background-size: 100%;
}

/*------------------------------
トップ - スマホ検索
------------------------------*/

ul.sp_kensaku
{
    display: none;
}

/*------------------------------
トップ - ダイエットとお菓子
------------------------------*/

#diet
{
    margin-top: 0px;
}

#diet h2
{
    line-height:1;
    font-weight:normal;
    text-align:left;
}
#diet h2 a {
    display: block;
    background: #fff url(../img/v4/arrow03.png) right 10px center no-repeat;
    text-align: center;
    font-size: 14px;
    padding-top: 10px;
    padding-bottom: 10px;
    border: 1px solid #dfe4d7;
}
#diet h2 a:hover
{
    opacity:0.8;
}

/*------------------------------
トップ - 栄養素について
------------------------------*/

#eiyouso
{
    margin-top: 30px;
}

#eiyouso h2
{
    margin-top: 10px;
    margin-bottom: 20px;
    padding-left: 10px;
    border-left: 3px solid #ffaf23;
    line-height:1.2;
    text-align:left;
    font-size: 16px;
}
#eiyouso h2 a:hover
{
    opacity:0.8;
}

#eiyouso ul
{
    letter-spacing: -.4em;
    margin-right: -8px;
}
#eiyouso ul li
{
    display:inline-block;
    vertical-align: top;
    width: calc(50% - 8px);
    height: 64px;
    margin: 0 8px 0px 0;
    letter-spacing: normal;
}
#eiyouso ul li a {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    padding-left: 90px;
    border: 1px solid #dfe4d7;
    background-color: #fff;
    background-position: 7px 7px;
    background-repeat: no-repeat;
    line-height: 64px;
    font-size: 15px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#eiyouso ul li:first-child a {
    background-image: url(../img/v4/pict_eiyouso.png);
}
#eiyouso ul li:last-child a {
    background-image: url(../img/v4/pict_eiyouso02.png);
}
#eiyouso ul li a:after {
    content: url(../img/v4/calorie_mark.png);
    position: absolute;
    right: 0;
    bottom: 0;
    line-height: 0;
}
#eiyouso ul li a:hover
{
    opacity:0.8;
}

/*------------------------------
トップ - スマホ（消費カロリー計算、BMI計算、アルコール摂取量計算）
------------------------------*/

ul.sp_rightbox1
{
    display: none;
    
    font-size:0;
    margin: 10px 12px 10px 12px;
}
ul.sp_rightbox1 li
{
    display:block;
    vertical-align: top;
}

ul.sp_rightbox1 li.sp_side_calorie
{
    border: #dfe4d7 1px solid;
    background-color: #ffffff;
}
ul.sp_rightbox1 li.sp_side_calorie a
{
    vertical-align: middle;
    display: block;
}
ul.sp_rightbox1 li.sp_side_calorie a img
{
    padding: 11px 0 11px 5%;
    width: 90%;
}

ul.sp_rightbox1 li.sp_side_bmi
{
    border-left: #dfe4d7 1px solid;
    border-right: #dfe4d7 1px solid;
    border-bottom: #dfe4d7 1px solid;
    background-color: #ffffff;
}
ul.sp_rightbox1 li.sp_side_bmi a
{
    vertical-align: middle;
    display: block;
}
ul.sp_rightbox1 li.sp_side_bmi a img
{
    padding: 11px 0 11px 5%;
    width: 90%;
}

ul.sp_rightbox1 li.sp_side_alcohol
{
    border-left: #dfe4d7 1px solid;
    border-right: #dfe4d7 1px solid;
    border-bottom: #dfe4d7 1px solid;
    background-color: #ffffff;
}
ul.sp_rightbox1 li.sp_side_alcohol a
{
    vertical-align: middle;
    display: block;
}
ul.sp_rightbox1 li.sp_side_alcohol a img
{
    padding: 13px 0 13px 5%;
    width: 90%;
}

/*------------------------------
トップ - バナー1
------------------------------*/

#banner1
{
    margin-top: 30px;
}

#banner1 ul
{
    font-size:0;
    text-align: center;
}
#banner1 ul li
{
    display:inline-block;
    vertical-align: top;
    width: 300px;
    margin: 0 0px 0px 0;
}
#banner1 ul li a:hover
{
    opacity:0.8;
}

/*------------------------------
トップ - 栄養計算コラム
------------------------------*/

#column
{
    margin-top: 20px;
}

#column h2
{
    margin-top: 30px;
    margin-bottom: 20px;
    padding-left: 10px;
    border-left: 3px solid #ffaf23;
    line-height:1.2;
    text-align:left;
    font-size: 16px;
}
#column h2 span
{
    float: right;
    display: inline-block;
    font-size: 12px;
    letter-spacing: .05em;
}
#column h2 span a {
    display: block;
    padding-left: 12px;
    padding-right: 12px;
    padding-bottom: 5px;
    border-bottom: 2px solid #7f3c1b;
}
#column h2 span a:hover
{
    opacity:0.8;
}
#column h2 span a:hover
{
    opacity:0.8;
}

#column h3
{
    margin-bottom: 15px;
    line-height:1;
    font-weight:normal;
    text-align:left;
    display: block;
}
#column h3 span.tab1
{
    width: 10%;
    border-left:#7f3c1b 1px solid;
    border-top:#7f3c1b 1px solid;
    border-right:#7f3c1b 1px solid;
    display: inline-block;
    font-size:12px;
    font-weight: bold;
    letter-spacing: 1px;
    color:#7f3c1b;
    padding: 10px 0% 10px 0%;
    text-align: center;
}
#column h3 span.tab2
{
    width: 10%;
    border-bottom:#7f3c1b 1px solid;
    display: inline-block;
    font-size:12px;
    font-weight: bold;
    letter-spacing: 1px;
    color:#996349;
    padding: 10px 0% 10px 0%;
    text-align: center;
    opacity:0.8;
}
#column h3 span.tab3
{
    width: 10%;
    border-bottom:#7f3c1b 1px solid;
    display: inline-block;
    font-size:12px;
    font-weight: bold;
    letter-spacing: 1px;
    color:#996349;
    padding: 10px 0% 10px 0%;
    text-align: center;
}
#column h3 span.tab4
{
    width: 69.7%;
    border-bottom:#7f3c1b 1px solid;
    display: inline-block;
    font-size:12px;
    font-weight: bold;
    letter-spacing: 1px;
    color:#7f3c1b;
    padding: 10px 0% 10px 0%;
    text-align: center;
}

ul.columnul
{
    font-size:0;
    padding-top: 15px;
}
ul.columnul li
{
    background-color: #ffffff;
}
ul.columnul li:nth-child(2n)
{
    background-color: #f6f9f1;
}
ul.columnul li a
{
    display: table;
    width: 100%;
}
ul.columnul li a:hover
{
    opacity:0.8;
}
ul.columnul li .img
{
    display: table-cell;
    width: 160px;
    vertical-align: middle;
}
ul.columnul li .txt {
    display: table-cell;
    padding: 10px 20px;
    vertical-align: middle;
}
ul.columnul li h4
{
    font-size:14px;
    font-weight: bold;
    letter-spacing: 1px;
    color:#7f3c1b;
    padding:0 20px 0 0;
    line-height:1.6;
    text-align: left;
}
ul.columnul li p
{
    font-size:12px;
    letter-spacing: 1px;
    color:#000000;
    padding:8px 20px 0px 0px;
    line-height:2.0;
    text-align: left;
}

#panels {
  background-color: white;
}
#panels .container {
    position: relative;
    margin: 0 auto;
    width: 100%;
    height: 480px;
    overflow-y: scroll;
}
#panels .container > section {
}
#panels section main {
  box-sizing: border-box;
}
#tabs-list li a {
    display: block;
    padding: 10px 15px;
}
#tabs-list li.active {
  border:#7f3c1b 1px solid;
    border-bottom: 1px solid #F6F9F1;

}

ul#tabs-list {
  list-style: none;
  border-bottom: 1px solid #7f3c1b;
  margin: 0;
  padding: 0;
}
ul#tabs-list li {
    display: inline-block;
  text-align: center;
  font-size: 12px;
  font-weight: bold;
  border-right:none;
  position: relative;
    bottom: -1px;
    z-index: 1;
    line-height: 1;
}
ul#tabs-list li:hover {
  -webkit-transition: none;
  transition: none;
}
ul#tabs-list li:hover.last {
}
ul#tabs-list li:hover + li {
}
ul#tabs-list li label.panel-label {
  position: relative;
  padding: 7px 0;
  font-size: 0.875em;
}
ul#tabs-list li label.panel-label:hover {
  padding-top: 7px;
}
ul#tabs-list li label.panel-label:hover::after {
  height: 6px;
}

main {
    width: 100%;
    margin: 0px auto 0px auto;
    background-color: #f6f9f1;
}
.panel-radios {
  display: none;
}

/*------------------------------
トップ - 右サイド
------------------------------*/

#rightbox ul.rightbox
{
    margin-top: 10px;
    letter-spacing: -.4em;
}
#rightbox ul.rightbox li
{
    display:block;
    vertical-align: top;
    letter-spacing: normal;
}
#rightbox ul.rightbox li a:hover
{
    opacity:0.8;
}

#rightbox ul.rightbox li.banner3 img {
    max-width: 100%;
}


#rightbox ul.rightbox li.side_kaiin
{
    border: #dfe4d7 1px solid;
    background-color: #ffffff;
    margin-top: 18px;
    margin-bottom: 18px;
}
#rightbox ul.rightbox li.side_kaiin h2
{
    text-align: center;
    background-color: #dde7ce;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 14px;
}
#rightbox ul.rightbox li.side_kaiin h2 img
{
}

#rightbox ul.rightbox li.side_kaiin ul.side_kaiin1
{
    font-size:0;
}
#rightbox ul.rightbox li.side_kaiin ul.side_kaiin1 li
{
    display:block;
    vertical-align: top;
    text-align: left;
    font-size:14px;
    color:#000000;
    margin-left: 20px;
    margin-right: 20px;
    padding:15px 0px 10px 0px;
    line-height:1.6;
    border-bottom: #dfe4d7 1px solid;
}
#rightbox ul.rightbox li.side_kaiin ul.side_kaiin1 li:nth-child(2)
{
    font-size:12px;
    color:#000000;
    margin-left: 20px;
    margin-right: 20px;
    padding:10px 0px 15px 0px;
    border-bottom: none;
}

#rightbox ul.rightbox li.side_kaiin ul.side_kaiin2
{
    font-size:0;
    text-align: center;
}
#rightbox ul.rightbox li.side_kaiin ul.side_kaiin2 li
{
    vertical-align: top;
}
#rightbox ul.rightbox li.side_kaiin ul.side_kaiin2 li:nth-child(1)
{
    display: inline-block;
    margin:0px 6px 6px 0px;
}
#rightbox ul.rightbox li.side_kaiin ul.side_kaiin2 li:nth-child(2)
{
    display: inline-block;
    margin:0px 0px 6px 0px;
}
#rightbox ul.rightbox li.side_kaiin ul.side_kaiin2 li:nth-child(3)
{
    display: inline-block;
    margin:0px 6px 10px 0px;
}
#rightbox ul.rightbox li.side_kaiin ul.side_kaiin2 li:nth-child(4)
{
    display: inline-block;
    margin:0px 0px 10px 0px;
}
#rightbox ul.rightbox li.side_kaiin ul.side_kaiin2 li:nth-child(5)
{
    display: block;
    margin:0px 0px 20px 0px;
}
#rightbox ul.rightbox li.side_kaiin ul.side_kaiin2 li:nth-child(6)
{
    display: block;
    margin:0px 20px 20px 0px;
    text-align: right;
}
#rightbox ul.rightbox li.side_kaiin ul.side_kaiin2 li:nth-child(6) a
{
    display: inline-block;
    color: #000;
    font-weight: bold;
    font-size: 16px;
    padding: 2px 30px;
    background: url(../img/v4/arrow04.png) right center no-repeat;
}

#rightbox ul.rightbox li.side_kaiin_login
{
    border: #dfe4d7 1px solid;
    background-color: #ffffff;
    margin-top: 18px;
    margin-bottom: 18px;
}
#rightbox ul.rightbox li.side_kaiin_login h2
{
    text-align: center;
    background-color: #dde7ce;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 14px;
}
#rightbox ul.rightbox li.side_kaiin_login h2 img
{
}

#rightbox ul.rightbox li.side_kaiin_login ul.side_kaiin1
{
    text-align: center;
}
#rightbox ul.rightbox li.side_kaiin_login ul.side_kaiin1 li
{
    vertical-align: top;
}
#rightbox ul.rightbox li.side_kaiin_login ul.side_kaiin1 li:nth-child(1)
{
    display: block;
    margin:20px 0px 6px 0px;
}
#rightbox ul.rightbox li.side_kaiin_login ul.side_kaiin1 li:nth-child(2)
{
    display: block;
    margin:0px 0px 10px 0px;
}
#rightbox ul.rightbox li.side_kaiin_login ul.side_kaiin1 li:nth-child(3)
{
    display: block;
    margin:0px 0px 10px 0px;
    color: #f94a63;
    font-size: 12px;
    font-weight: bold;
}
#rightbox ul.rightbox li.side_kaiin_login ul.side_kaiin1 li:nth-child(4)
{
    display: block;
    margin:0px 20px 20px 0px;
    text-align: right;
}
#rightbox ul.rightbox li.side_kaiin_login ul.side_kaiin1 li:nth-child(4) a {
    display: inline-block;
    color: #000;
    font-weight: bold;
    font-size: 16px;
    padding: 2px 30px;
    background: url(../img/v4/arrow04.png) right center no-repeat;
}

#rightbox ul.rightbox li.side_calorie
{
    border: #dfe4d7 1px solid;
    background-color: #ffffff;
}
#rightbox ul.rightbox li.side_calorie a
{
    vertical-align: middle;
    display: block;
}
#rightbox ul.rightbox li.side_calorie a,
#rightbox ul.rightbox li.side_bmi a,
#rightbox ul.rightbox li.side_alcohol a {
    display: block;
    height: 55px;
    position: relative;
}
#rightbox ul.rightbox li.side_calorie a .txt,
#rightbox ul.rightbox li.side_bmi a .txt,
#rightbox ul.rightbox li.side_alcohol a .txt {
    color: #7f3c1b;
    font-size: 16px;
    font-weight: bold;
    line-height: 55px;
}

#rightbox ul.rightbox li.side_calorie a img,
#rightbox ul.rightbox li.side_bmi a img,
#rightbox ul.rightbox li.side_alcohol a img
{
    width: 55px;
}
#rightbox ul.rightbox li.side_calorie a img,
#rightbox ul.rightbox li.side_bmi a img,
#rightbox ul.rightbox li.side_alcohol a img {
    
}

#rightbox ul.rightbox li.side_bmi
{
    border-left: #dfe4d7 1px solid;
    border-right: #dfe4d7 1px solid;
    border-bottom: #dfe4d7 1px solid;
    background-color: #ffffff;
}
#rightbox ul.rightbox li.side_bmi a
{
    vertical-align: middle;
    display: block;
}

#rightbox ul.rightbox li.side_alcohol
{
    border-left: #dfe4d7 1px solid;
    border-right: #dfe4d7 1px solid;
    border-bottom: #dfe4d7 1px solid;
    background-color: #ffffff;
}
#rightbox ul.rightbox li.side_alcohol a
{
    vertical-align: middle;
    display: block;
}

#rightbox ul.rightbox li.questionnaire01
{
    margin: 16px 0 8px;
    width: 100%;
    height: 70px;
    display: inline-block;
    background: url(../img/v4/btn_questionnaire01.png) 0 0 no-repeat;
}
#rightbox ul.rightbox li.questionnaire01 a {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    color: #000;
    font-size: 13px;
    font-weight: bold;
}
#rightbox ul.rightbox li.questionnaire01 a .txt {
    margin-left: 20px;
    line-height: 70px;
}
#rightbox ul.rightbox li.questionnaire02
{
    margin-bottom: 16px;
    width: 100%;
    height: 70px;
    display: inline-block;
    background: url(../img/v4/btn_questionnaire02.png) 0 0 no-repeat;
}
#rightbox ul.rightbox li.questionnaire02 a {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    color: #000;
    font-size: 14px;
    font-weight: bold;
}
#rightbox ul.rightbox li.questionnaire02 a .txt {
    margin-left: 20px;
    line-height: 70px;
}
#rightbox ul.rightbox li.banner4
{
    margin: 0px 0px 16px 0px;
    text-align: center;					/* add yoko */
}
#rightbox ul.rightbox li.banner4 img {
    max-width: 100%;
}

#rightbox ul.rightbox li.side_youtube_pc
{
    margin: 0px 0px 16px 0px;
}
#rightbox ul.rightbox li.side_youtube_pc iframe
{
    width: 100%;
}

#rightbox ul.rightbox li.side_youtube
{
    display: none;
    
    margin: 0px 0px 16px 0px;
}

#rightbox ul.rightbox li.side_facebook
{
    margin: 0px 0px 5px 0px;
}
#rightbox ul.rightbox li.side_twitter
{
    margin: 0px 0px 5px 0px;
}
#rightbox ul.rightbox li.side_instagram
{
    margin: 0px 0px 16px 0px;
}

#rightbox ul.rightbox li.side_tweets
{
    margin: 0px 0px 0px 0px;
    width: 240px;
    height: 300px;
}

#rightbox ul.rightbox li.sp_banner3
{
    display: none;
    
    margin: 15px 12px 15px 12px;
    text-align: center;
}
#rightbox ul.rightbox li.sp_banner3 img
{
    width: 300px;
    height: auto;
}


/*------------------------------
スマホ
------------------------------*/

.sp-header-menu
{
    display:none;
}

.slidemenu {
    display: none;
}