#hapipre h2, #hapipre h3, #hapipre h4, #hapipre .copy, #hapipre .btn{
    font-family: "Yu Gothic", YuGothic, ヒラギノ角ゴシック, "Hiragino Sans", メイリオ, Meiryo, sans-serif;
}

#hapipre a {
    color: #4dbbaa;
}
#hapipre a:hover {
    text-decoration:underline;;
}
#hapipre .text-green {
    color: #4dbbaa;
}
#hapipre .text-pink {
    color: #ec6d6d;
}
#hapipre .text-yellow {
    color: #fbc93e;
}
#hapipre .text-gray {
    color:#222;
}

#hapipre .text-link--arrow {
    color: #4dbbaa;
}
#hapipre .text-link--arrow:before {
    background:url(https://www.green-dog.com/assets/vendor/fonts/stylesheet/images/icon/black/arrow.svg) no-repeat;
    }
#hapipre .pagelink-list {
    margin-bottom: 30px;
    padding: 15px 10px;
    display: flex;
    flex-wrap: wrap;
    background-color: #FBF6ED;
}

#hapipre .pagelink-list__item:nth-child(-n+2) {
    margin-top: 0;
}
#hapipre .pagelink-list__item {
    margin: 10px 10px 0 0;
    display: flex;
    align-items: center;
    position: relative;
    width: calc((100% - 20px)/2);
    background-color: #fff;
    box-shadow: rgb(0 0 0 / 20%) 0 0 6px;
    border-radius: 4px;
    color: #555;
    font-size: 13px;
    font-weight: bold;
}
#hapipre .pagelink-list__item a {
    padding: 10px 25px 10px 15px;
    position: relative;
    width: 100%;
    box-sizing: border-box;
    text-decoration: none;
    color: #444333;
}
#hapipre .mainimg_copy {
    font-size: 2.5rem;
}
#hapipre .heading01 {
    background: white;
    color:#270B00;
    line-height: 1.5em;
    margin-top: 20px;
    height: auto;
}
#hapipre .heading01--small {
    background: #542F00;
}
#hapipre .label--circle {
    background: white;
    color:#270B00;
}

#hapipre .headline02 {
    margin-bottom: 15px;
    padding: 30px 0px;
    color: #270B00;
    font-size: 26px;
    font-weight: bold;
    text-align:center;

    background: url(/aboutus/csr/inukoto/images/bg_midashi.jpg)no-repeat;
}
#hapipre .heading02 {
border-top: 1px solid #270B00;
border-bottom: 1px solid #270B00;
}
#hapipre .heading02:before {
    background: white;
}
#hapipre .headline03 {
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #555;
    color: #555;
    font-size: 16px;
    font-weight: bold;
}
#hapipre .heading03{
    color: #542f00;
}
#hapipre .heading03--basic:before {
    background: #270B00;
}

#hapipre .panel-box__heading {
    color: #542f00;
    background: #fbf6ed;
}
#hapipre .pagelink-list__item a::after {
    content: "";
    position: absolute;
    background: url(/assets/vendor/fonts/stylesheet/images/icon/gray/arrow.svg)no-repeat;
    width: 10px;
    height: 10px;
    right: 15px;
    top: 50%;
    transform: translateY(-50%) rotateZ(
90deg);
}
/*
#hapipre .bg-berge {
   background-color:#FBF6ED;
}
*/

#hapipre .logo {
    /* width:60%; */
    margin:50px auto;}
#hapipre #jissekilink {border:none;}
#hapipre #jissekilink .navigation-category__item:nth-child(3n+1) {
    border-top: 1px solid #e9e9e9;
}

#hapipre .call-to-action {
    /* background-color: #FBC93E; */
    background-color: #fbf6ed;
    color: #222;
    text-align: center;
    padding: 60px 0 60px;
}
#hapipre .call-to-action-insta {
    color:#222;
    padding: 30px 0 60px;
}
#hapipre .call-to-action .btn {
    margin: 0 auto;
}
#hapipre .btn {
    text-decoration: none;
    color: #fff;
    display: block;
    width: 90%;
    line-height: 1.3em;
    margin: 0px auto;
    font-size: 20px;
    padding: 15px 20px;
    background: #ec6d6d url(https://www.green-dog.com/assets/vendor/fonts/stylesheet/images/icon/black/arrow.svg) no-repeat right 12px center/10px 10px;
    font-weight: bold;
    border-radius: 4px;
    box-sizing: border-box;
    box-shadow: rgb(0 0 0 / 20%) 0 0 6px;
}
#hapipre .btn:hover {
  opacity: 0.9;
}

#hapipre .call-to-action-insta .btn {
    color: #222;
    background: white url(https://www.green-dog.com/assets/vendor/fonts/stylesheet/images/icon/black/arrow.svg) no-repeat right 12px center/10px 10px;
}

#hapipre .ico-insta {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(https://www.green-dog.com/shop/assets/images/icon/black/ico_insta.svg) no-repeat left top/cover;
}

#hapipre .panel-flow:after {
    top: auto;
    bottom: -25px;
    left: 50%;
    right: 50%;
    margin-left: -14px;
    background-image: url(https://www.green-dog.com/common/images/common/sprite.png);
    background-position: -24px -29px;
    width: 28px;
    height: 18px;
    background-size: 110px 90px;
}

/*  accordion  */
.accordion {
    border-top: none;
    margin: 20px auto 0px;
    max-width: 100vw;
    }
    .toggle {
    display: none;
    }
    .option {
    position: relative;
    margin-bottom: 1em;
    }
    .title,
    .content2 {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transform: translateZ(0);
    transition: all 0.3s;
    }
    .title {
    border: solid 1px #ccc;
    padding: 1em;
    display: block;
    color: #333;
    font-weight: bold;
    }
    .title::after,
    .title::before {
    content: "";
    position: absolute;
    right: 1.25em;
    top: 1.25em;
    width: 2px;
    height: 0.75em;
    background-color: #999;
    transition: all 0.3s;
    }
    .title::after {
    transform: rotate(90deg);
    }
    .content2 {
    max-height: 0;
    overflow: hidden;
    }
    .content2 p,.content2 ul {
    margin: 0;
    padding: 0.5em 1em 1em;
    font-size: 0.9em;
    line-height: 1.5;
    }
    .toggle:checked + .title + .content2 {
    max-height: 500px;
    transition: all 1.5s;
    }
    .toggle:checked + .title::before {
    transform: rotate(90deg) !important;
    }

#hapipre .productlistwrap {display: flex;align-items: center;}
#hapipre .iconp {
    width:45px;
    margin-right:6px;
}



@media screen and (min-width: 768px){
#hapipre .logo {width:100%;}
#hapipre .mainimg_copy {
    font-size: 3rem;
}
#hapipre .headline03 {
    margin-bottom: 25px;
    padding-bottom: 6px;
    display: flex;
    align-items: center;
    border-bottom: 2px solid #555;
}
#hapipre .pagelink-list__item {
    width: calc((100% - 40px)/4);
}
#hapipre .pagelink-list__item {
    margin: 0px 10px 0 0;
}
#hapipre .btn {width:50%;}
#hapipre .row .btn {width:100%;}


}