@charset "Shift_JIS";

/*==============================================
共通 ここから
================================================*/

/* パンくず削除 */
#pankuzu {
    display: none;
}
.header-info-red {
    display: none !important;
}

/* 価格プロ リセット */
.buy_price>ol, .buy_price>ul {
    margin: 0;
}
.buy_price>ol .spesicalprice, .buy_price>ul .spesicalprice,.buy_price>ul .intax {
    display: none;
}

/* 変数指定 */
:root {
    --font-size-text: 3.6cqw;
    --color-main: #d7201c;
}

#royalcanin .smp_none {
    display: none;
}
/*==============================================
共通 ここまで
================================================*/

/*==============================================
#royalcanin 設定 STR
================================================*/
#royalcanin * {
    box-sizing: border-box;
    font-size: var(--font-size-text);
}
#royalcanin {
    text-align: center;
    background: #fff;
    color: #333;
    overflow: hidden;
}
#royalcanin img {
    width: 100%;
    height: auto;
    display: block;
}
#royalcanin a {
    display: block;
}

/*==============================================
#royalcanin 設定 END
================================================*/

/*==============================================
#royalcanin 大枠  STR
================================================*/
#royalcanin .contents{
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    container-type: inline-size;
}
#royalcanin section{
    width: 100%;
    margin: 0 auto;
    padding:0;
}
#royalcanin section.top{
    padding:0;
}
#royalcanin .inner{
    margin: 0 auto;
    width: 100%;
    background: #f3f3f3;
}
#royalcanin .inner img{
    max-width: 750px;
    width: 100%;
    margin: 0 auto;
}
#royalcanin section.top .inner{
    gap:0;
}
/*==============================================
#royalcanin 大枠 END
================================================*/

/*==============================================
#royalcanin 見出し  STR
================================================*/
#royalcanin .midashi{
    display: flex;
    justify-content: center;
    position: relative;
    text-align: center;
}
#royalcanin .midashi-main{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: .5em;
    position: relative;
    padding:0;
}
#royalcanin .midashi-main h3{
    font-size: 1.7em;
    display: flex;
    justify-content: center;
    flex-direction: row;
    width: 100%;
    align-items: center;
    color:#4f4b49;
    flex-wrap: wrap;
}
/*==============================================
#royalcanin 見出し END
================================================*/

/*==============================================
#royalcanin アンカー  STR
================================================*/
#royalcanin .menu_inner ul{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .1em;
}
#royalcanin .menu_inner ul li{
    
}
#royalcanin .menu_inner ul li a{
    color: #fff;
    padding: .9em .9em .9em 0;
    position: relative;
    font-size: .95em;
    background: #9d9b9a;
}

#royalcanin .menu_inner ul li a::after {
    position: absolute;
    display: inline-block;
    vertical-align: middle;
    content: "";
    width: .4em;
    height: .4em;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    margin: auto;
    top:0;
    bottom: 0;
    right: 7%;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transition: 0.3s all;
}
/*==============================================
#royalcanin アンカー  END
================================================*/

/*==============================================
#royalcanin バナー  STR
================================================*/
#royalcanin .feature-title{
    font-size: 1.1em;
    color: #fff;
}
#royalcanin .feature-list{
    display: flex;
    flex-wrap: wrap;
    gap: .4em;
}
#royalcanin .feature-list.col_1 li{
    width: 100%;
}
#royalcanin .feature-list.col_2 li{
    width: calc(calc(100% - 4%) / 2);
}
#royalcanin .feature-list.col_3 li{
    width: calc(calc(100% - 4%) / 3);
}
/*==============================================
#royalcanin バナー END
================================================*/

/*==============================================
#royalcanin TOPへ戻る  STR
================================================*/
#royalcanin .pagetop {
    position: fixed;
    bottom: 4.5em;
    right: 1em;
	z-index: 3;
}
#royalcanin .pagetop a {
	display: flex;
	justify-content: center;
    align-items: center;
    text-align: center;
	vertical-align: middle;
	color: #fff;
	font-size:.8em;
	font-weight:lighter;
	background-color: #222222c7;
	border-radius: 80px;
	width:5em;
	height:5em;
    line-height: 1.3em;
    transition: 0.3s all;
}
#royalcanin .pagetop a:hover{
    color: #fff !important;
    opacity: .8;
    transform: translateY(-2px);
}
/*==============================================
#royalcanin TOPへ戻る  END
================================================*/

/* 20260715 T.ABE ADD [画像追加・修正] STA  */
#menu img{
    width: 90%;
    margin: 1rem auto;
}
/* 20260715 T.ABE ADD [画像追加・修正] END  */