/***　TOPページ用CSS　***/


/*訃報*/
#fuhou{
width:740px;
margin:40px auto;
border:1px solid gray;
border-radius:10px;
padding:20px;
}
.fuhou_title{
font-weigt:bold;
text-align:center;
padding-bottom:20px;
}
.fuhou_msg{

}
.fuhou_date, .fuhou_sign{
text-align:right
}


/***フッター用***/
#ft_left h1{
padding:10px 0;
font-size:1.4rem;
}


/***コンテンツ全体設定（ヘッダー・フッター除く）***/
#top_cnt{width:auto}

/**メイン画像箇所**/
/*#intro div{height:468px}*/
h1#slogan{
background:url(../img/top/sign_topbg.png) center top no-repeat;
background-size:cover;
text-align:center;
}
/*webp対応サポート*/
/* 背景画像の制御 */
#slogan {
    background-image: url("../img/top/sign_topbg.png"); /* フォールバック */
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

/* ブラウザが対応していればWebP背景を表示 */
@supports (background-image: url("../img/top/sign_topbg.webp")) {
    #slogan {
        background-image: url("../img/top/sign_topbg.webp");
    }
}

/* 画像が細くなるのを防ぐ強制指定 */
#slogan img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 1000px; /* 元の画像幅に合わせて調整してください */
    margin: 0 auto;
}

#intro ul{
border:1px solid #ccc;
/*width:calc(100% - 2px);*/
}
#intro ul li{
font-size:2.0rem;
padding:10px 0;
text-align:center;
font-family:Reimin Medium;
width:33.3%;
letter-spacing:0.1rem;
}
#intro ul li:nth-of-type(1), #intro ul li:nth-of-type(2){border-right:1px solid #ccc}
#intro ul li#sp:hover{background:#e6f2d7}
#intro ul li#gd:hover{background:#dae5f7}
#intro ul li#wt:hover{background:#e2f1f8}



/**メイン情報箇所**/
div#info{
width:780px;
margin:40px auto;
}
#info h1{
color:#5dab92;
border-left:5px solid #5dab92;
background-color:#eaebe9;
font-size:2.0rem;
padding:8px 0 8px 25px;
font-family:UD Shin Go Conde90 M;
}
#info dl, #info div{margin:20px 30px}
#info dl dt{
color:#777;
clear:left;
font-weight:bold;
line-height:125%;
/*text-decoration:underline;*/
}
#info dl dd{
color:#333;
font-size:1.5rem;
float:left;
margin-bottom:10px;
}
#info dl dd a{
color:#333;
font-weight:bold;
text-decoration:underline;
}
#info dl dd a:hover{text-decoration:none}
#info ul{margin:30px 20px}
#info ul li img{
margin-left:10px;
margin-right:10px;
width:350px;
height:100px;
}

/**商品一覧**/
div#lst_hd, div#lst_md, div#lst_ft{width:100%}
div#lst_hd{
background:url(../img/top/itemlist_hd.png) center bottom no-repeat;
background-size:auto 320px;
}
#lst_hd h1, #lst_hd p{text-align:center}
#lst_hd h1{
font-size:4.8rem;
font-weight:bold;
color:#5dab92;
padding-top:50px;
font-family:Reimin Medium, serif;
}
#lst_hd p{
font-size:2.6rem;
color:#424b54;
line-height:180%;
letter-spacing:2px;
padding-top:20px;
padding-bottom:30px;
font-family:Shin Maru Go Regular;
}
div#lst_md{background:#e6f4e9}
#lst_md ul{
width:1040px;
margin:0 auto;
padding-top:20px;
}
#lst_md ul li{
width:240px;
text-align:center;
}
#lst_md ul li img{
width:180px;
height:180px;
}
#lst_md ul li p{
font-size:1.2rem;
line-height:180%;
}
#lst_md ul li em{
font-weight:bold;
font-size:1.4rem;
}
#lst_md ul li a{color:#333}
#lst_md ul li a:hover{text-decoration:underline}
div#lst_ft{
background:url(../img/top/itemlist_ft.png) center bottom no-repeat;
background-size:auto 320px;
}
#lst_ft ul{
padding-top:50px;
padding-bottom:50px;
}
#lst_ft ul li{
width:240px;
font-size:1.8rem;
margin-left:25px;
margin-right:25px;
text-align:center;
border-radius:20px;
padding:15px 0 15px 20px;
background-position:15px center;
background-size:15% auto;
}

/**連載・特集コンテンツ**/
div#cnt_lst{
width:1040px;
margin:30px auto 0 auto;
text-align:center;
}
#cnt_lst h1{
font-size:3.2rem;
font-weight:400;
color:#000;
font-family:'Noto Sans JP', sans-serif;
}
p.h_en{
font-size:1.6rem;
color:#5dab92;
letter-spacing:5px;
font-family:UD Shin Go Conde90 M;
}
#cnt_lst ul{margin-top:20px}
#cnt_lst ul li{
border:2px solid #ccc;
border-radius:20px;
padding:15px;
}
li.cnt_lst_b{width:460px}
li.cnt_lst_b p img{
width:100px;
border:3px solid #fff;
border-radius:50px;
margin-top:180px;
}
p#cnt_lst_sakai{background:url("../img/top/bnr_sakai.png") center top no-repeat}
p#cnt_lst_column{background:url("../img/top/bnr_column.png") center top no-repeat}
#cnt_lst h2{font-weight:bold}
.cnt_lst_b h2{font-size:1.8rem}
.cnt_lst_title{
font-weight:600;
padding-top:15px;
}
li.cnt_lst_s{width:200px}
li.cnt_lst_s img{width:200px}
.cnt_lst_s h2{font-size:1.5rem}
.row_sg h2{line-height:280%}
.row_db h2{line-height:140%}

/**バナーリンク**/
ul#link_bnr{
width:100%;
width:1040px;
margin:70px auto 0 auto;
}
ul li.viva_bnr img{width:350px}
ul li.share_bnr img{width:250px}


/***************************************/
/*****　タブレット用CSS(iPad基準)　*****/
/***************************************/
@media screen and (max-device-width:768px) {


/*Safari*/
_::-webkit-full-page-media, _:future, :root #intro ul li{
width:calc(106vw / 4);
}

}

/****************************************************/
/*****　スマホ用横置き専用CSS(iPhone6plusまで)　*****/
/****************************************************/
@media screen and (max-device-width:736px) and (orientation: landscape){

html{line-height:120%}

}

/**********************************************/
/*****　スマホ用CSS(iPhone6plusまで対応)　*****/
/**********************************************/
@media screen and (max-device-width:414px) , screen and (max-device-width:736px) and (orientation: landscape){


/*訃報*/
#fuhou{
width:85%;
margin:40px auto;
border:1px solid gray;
border-radius:20px;
padding:30px;
}
.fuhou_title{
font-weigt:bold;
text-align:center;
padding-top:20px;
padding-bottom:40px;
font-size:4.0rem;
}
.fuhou_msg{
font-size:4.0rem;
padding-bottom:40px;
}
.fuhou_date, .fuhou_sign{
text-align:right;
font-size:4.0rem;
}


/*フッター*/
#ft_left h1{font-size:4.0rem}


/*紹介画像*/
/*
#intro ul{
display:block;
flex-wrap: wrap;
border:none !important
}
*/
#intro ul{
width:100%
}
#intro ul li p{
font-size:4.0rem;
display:inline-block;
}

/*
#intro ul li{
width:calc(25% - 8px);
font-size:4.0rem;
padding:25px 0;
border-bottom:2px solid #ccc;
border-left:2px solid #ccc;
display:inline-block;
}
#intro ul > a:first-child, #intro ul > a:nth-child(3){border-left:none !important}
*/

/*トピックス他情報*/
div#info{
width:auto;
margin-top:80px;
padding:0 40px;
}
#info h1{
font-size:4.4rem;
padding:12px 0 12px 30px;
border-width:10px;
}
#info dl dt, #info div p{font-size:4.0rem}
#info dl dd{
font-size:4.2rem;
line-height:1.4em !important;
margin-bottom:40px;
}
#info ul{
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
#info ul li{margin-bottom:20px}
#info ul li img{
width:75vw;
height:auto;
}

/*商品一覧*/
div#lst_hd{
background:url(../img/top/itemlist_hd_sm.png) center bottom no-repeat;
background-size:cover;
}
#lst_hd h1{font-size:6.4rem}
#lst_hd p{
font-size:3.6rem;
line-height:160%
}
#lst_md{padding-bottom:40px}
#lst_md ul{
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
#lst_md ul li{
width:50%;
margin-bottom:20px
}
#lst_md ul li img{
width:50%;
height:auto;
}
#lst_md ul li p{font-size:3.2rem}
#lst_md ul li em{font-size:3.6rem}
div#lst_ft{
background:url(../img/top/itemlist_ft_sm.png) center bottom no-repeat;
background-size:cover;
}
#lst_ft ul{
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
padding-top:0;
display:block;
}
#lst_ft ul li{
width:55%;
margin-bottom:40px;
margin-right:auto;
margin-left:auto;
font-size:4.0rem;
border-radius:40px;
}

/*連載・特集コンテンツ*/
#cnt_lst h1{font-size:5.4rem}
p.h_en{font-size:4.0rem}
#cnt_lst ul{
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin:0 auto;
width:95%;
display:block;
}
#cnt_lst ul li{
padding:40px 0;
margin-bottom:30px;
}
#cnt_lst ul:first-of-type{
-webkit-justify-content:center;
justify-content:center;
}
#cnt_lst ul:last-of-type{width:95%}
li.cnt_lst_b p img{
width:25%;
border-radius:80px;
margin-top:230px;
}
li.cnt_lst_b{width:100%}
li.cnt_lst_s{
width:40%;
padding:30px !important;
display:inline-block;
}
p#cnt_lst_sakai, p#cnt_lst_column{background-size:95% auto}
.cnt_lst_b p{font-size:3.4rem}
#cnt_lst h2{font-weight:bold !important}
.cnt_lst_b h2{font-size:4.0rem}
.cnt_lst_s h2{font-size:3.4rem}
.cnt_lst_s p img{width:100%}

.cnt_fntsm{font-size:3.0rem !important}

/*バナーリンク*/
ul#link_bnr{
display:block;
margin:70px auto 0 auto;
}
ul#link_bnr li{
text-align:center;
margin-bottom:20px;
}
ul li.viva_bnr img{width:70%}
ul li.share_bnr img{width:50%}

/*告知箇所調整*/
div.notice{margin-bottom:50px !important}
div.notice p{line-height:1.6em}

}