@charset "utf-8";

/* 共通 */
.flex {
display: -webkit-flex;
display: -ms-flex;
display: flex;
}

/* header */
header {
position: fixed;
top: 0;
left: 0;
width: 100%;
padding: 0;
z-index: 10;
}
header h1 {
display: block;
position: absolute;
top: 50%;
left: 20px;
width: 200px;
transform: translateY(-50%);
z-index: 99;
}
header img { width: 100%;}

/* ナビゲーション */
#nav_Area {
width: 100%;
background-color: #fff;
z-index: 9;
}
.gnav {
max-width: 1200px;
width: 100%;
margin: 0 auto;
}
.gnav ul {
justify-content: center;
align-items: center;
width: 100%;
}
.gnav li { position: relative;}
.gnav li::after {
display: block;
content: '';
position: absolute;
top: 50%;
right: 0;
width: 1px;
height: 16px;
background-color: #ddd;
transform: translateY(-50%);
}
.gnav a {
display: block;
width: 100%;
padding: 20px 45px;
color: #402e32;
font-size: 14px;
line-height: 1.3;
text-align: center;
box-sizing: border-box;
transition: .3s;
}
.gnav a:hover { opacity: .5;}

#indexP .gnav li:nth-child(1)::before,
#reportP .gnav li:nth-child(3)::before,
#qaP .gnav li:nth-child(5)::before,
#simP .gnav li:nth-child(4)::before {
display: block;
content: '';
position: absolute;
bottom: 5px;
left: 50%;
width: 8px;
height: 8px;
background-color: #f3b81b;
border-radius: 100%;
box-sizing: border-box;
transform: translateX(-50%);
}

/* フッター */
footer {
width: 100%;
background-color: #fff;
}
footer .inner {
justify-content: space-between;
align-items: center;
max-width: 1200px;
width: 94%;
padding: 30px 0;
margin: 0 auto;
}
footer img { width: 100%;}
footer .inner a {
display: block;
max-width: 355px;
width: 90%;
transition: .3s;
}
footer .inner a:hover { opacity: .5;}

.company_Box {
justify-content: flex-start;
align-items: center;
}
.company_Box h2 {
display: block;
width: 212px;
padding: 0 20px 0 0;
margin-right: 20px;
border-right: 1px solid #402e32;
box-sizing: border-box;
}
.company_Box p {
display: inline-block;
font-size: 12px;
line-height: 1.8;
}
.company_Box small { font-size: 12px;}
.company_Box span {
padding: 0 0 0 10px;
color: #d91300;
font-size: 22px;
font-weight: 600;
box-sizing: border-box;
}
.copyright {
display: block;
width: 100%;
padding: 10px 0;
color: #fff;
background-color: #492003;
font-size: 10px;
text-align: center;
}

/* トップ */
.sticky {
position: -webkit-sticky;
position: sticky;
top: 0;
}
.sticky02 {
position: -webkit-sticky;
position: sticky;
top: -50%;
}
.pos_re {
position: relative;
width: 100%;
height: 0;
padding-top: 56%;
}



/* トップコンテンツ */
#content_Area {
position: relative;
width: 100%;
padding: 20px 0 0;
background-color: #f3b81a;
z-index: 1;
}
.contents_Ttl {
display: block;
max-width: 238px;
width: 90%;
margin: 0 auto 30px;
text-align: center;
}
.contents_Ttl img { width: 100%;}

/* お知らせ# */
#news_Block {
max-width: 1200px;
width: 94%;
padding: 50px 0 150px;
margin: 0 auto;
}
#pet_News_Area {
width: 100%;
padding: 30px;
background-color: #fff;
border-radius: 30px;
box-sizing: border-box;
}
.news_List li {
padding: 14px 0;
border-bottom: 1px dotted #402e32;
}
.news_List li:first-child { padding-top: 0;}
.news_List li:last-child {
padding-bottom: 0;
border-bottom: none;
}
.news_List dl {
display: -webkit-flex;
display: -ms-flex;
display: flex;
justify-content: flex-start;
align-items: center;
width: 100%;
font-size: 14px;
}
.news_List dt {
margin-right: 20px;
font-weight: normal;
}

/* 製品情報 */
#product_Block {
width: 100%;
padding: 50px 0 150px;
background: url(../../../../../../img/pet/2020/top/pattern_01.png);
-webkit-background-size: 28px 29px;
background-size: 28px 29px;
}
#product_Block .inner {
max-width: 1200px;
width: 94%;
margin: 0 auto;
}
#product_Block img { width: 100%;}
#product_Flex {
justify-content: space-between;
align-items: stretch;
}
.product_Box {
max-width: 570px;
width: 100%;
padding: 30px;
background-color: #fff;
border-radius: 20px;
box-sizing: border-box;
box-shadow: 0 33.3px 26.3px -50px rgba(0, 0, 0, 1), 0 40px 42px -50px rgba(0, 0, 0, 0.584);
}
.product_Box:first-child { margin-right: 60px;}

.product_inner figure {
max-width: 255px;
width: 90%;
margin: 0 auto;
}
.product_inner h4 {
display: block;
width: 100%;
padding: 30px 0 15px;
margin-bottom: 15px;
border-bottom: 2px dotted #402e32;
color: #d91300;
font-size: 22px;
font-weight: 600;
line-height: 1.2;
text-align: center;
}
.product_inner p {
padding: 0 0 30px;
font-size: 14px;
line-height: 1.8;
text-align: justify;
}
.product_inner a {
display: block;
max-width: 288px;
width: 90%;
margin: 0 auto;
transition: .3s;
}
.product_inner a:hover { opacity: .7;}
.product_inner ul { padding: 0 0 20px;}
.product_inner li {
padding: 10px 0;
border-bottom: 1px dotted #aaa;
}
.product_inner li:last-child { border-bottom: none;}
.product_inner dl {
display: -webkit-flex;
display: -ms-flex;
display: flex;
justify-content: flex-start;
align-items: center;
font-size: 14px;
line-height: 1.3;
}
.product_inner dt {
width: 27%;
border-right: 1px solid #aaa;
}
.product_inner dd {
width: 73%;
padding: 0 0 0 20px;
box-sizing: border-box;
}

/* ポイント */
#point_Block {
max-width: 1254px;
width: 94%;
padding: 50px 0 150px;
margin: 0 auto;
}
#point_Block img { width: 100%;}
#point_Block .flex {
justify-content: center;
align-items: flex-start;
width: 100%;
margin-bottom: 30px;
}
#point_Block .flex li {
max-width: 397px;
width: calc((100% - 40px) / 3);
margin-right: 20px;
}
#point_Block a {
display: block;
max-width: 380px;
width: 90%;
margin: 0 auto;
transition: .3s;
}
#point_Block a:hover { opacity: .5;}

/* 情報 */
#contents_Block {
width: 100%;
padding: 50px 0 150px;
background: url(../../../../../../img/pet/2020/top/pattern_01.png);
-webkit-background-size: 28px 29px;
background-size: 28px 29px;
}
#contents_Block img { width: 100%;}

#contents_Block a { transition: .3s;}
#contents_Block a:hover { opacity: .7;}

.column3 {
justify-content: center;
align-items: flex-start;
}
.column3 li {
max-width: 394px;
width: calc((100% - 60px) / 3);
margin-right: 30px;
}
.column3 li:last-child { margin-right: 0;}

.column2 {
justify-content: center;
align-items: stretch;
}
.column2 li {
max-width: 599px;
width: calc((100% - 30px) / 2);
margin-right: 30px;
}
.column2 li:last-child { margin-right: 0;}

#slider_Block {
width: 100%;
padding: 30px 0;
background: url(../../../../../../img/pet/2020/top/slide_bg.png) no-repeat center top;
background-size: 100% 100%;
box-sizing: border-box;
}
#slider_Block h3 {
display: block;
width: 450px;
padding: 10px 0;
margin: 0 auto;
border-bottom: 2px dotted #4d2c1f;
color: #4d2c1f;
font-size: 20px;
line-height: 1;
text-align: center;
}
#slider section {
justify-content: flex-start;
align-items: flex-start;
width:
}
#slider {
width: 450px;
padding: 20px 0 0;
margin: 0 auto;
}
#slider li { outline: none;}
.member_img {
width: 120px;
margin-right: 20px;
}
.memver_txt { width: calc(100% - 140px);}
.memver_txt h4 {
padding: 0 0 10px;
color: #d91300;
font-size: 18px;
}
.memver_txt p {
font-size: 14px;
line-height: 1.6;
}

/* トップ */
#contents {
margin: 0;
padding: 80px 0;
position: relative;
}
#contents .sideBtn {
position: fixed;
z-index: 999;
right: 0;
top: 100px;
}
#contents .sideBtn02 {
position: fixed;
z-index: 999;
right: 0;
top: 270px;
}
#contents .sideBtn a:hover,
#contents .sideBtn02 a:hover {
opacity: 0.7;
}