.fixed-obj {
    position: fixed;
    top:5%;
    right: 0;
    width: 62px;
    height: 207px;
    z-index: 1;
}

.area {
    margin: 0 auto;
    padding-left: 125px;
    background-color: #fff;
}
.area img {width: 100%;}
.top {
    position: relative;
    width: 98%;
    height: auto;
    padding: 2% 2% 0 0;
}
.top .caption {
    position: absolute;
    opacity: 0;
    transition: all 1s ease;
}
.top .caption.active {
    top: 11%;
    opacity: 1;
}
.contents {
    max-width: 736px;
    margin: 0 auto;
}
.contents .info{
    margin-left: 10px;
}

.page1 {
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding-top: 30px;
    line-height: 0;
}
.page1 .img {
    width: 330px;
}
.page1 .info {
    width: 382px;
    position: relative;
}
.page1 .info .name {
    margin-top: auto;
    position: absolute;
    bottom: 0;
}
.page1 .info .text {
    font-size: 14px;
    line-height: 24px;
    margin-bottom: 20px;
}
.page1 .info .note {
    font-size: 10px;
    line-height: 16px;
    margin-top: 20px;
}
.page1 .info .name .genre {
    display: block;
    font-size: 12px;
    line-height: 22px;
    color: #5a5a5a;
    margin-bottom: 5px;
}
.page1 .info .name a {
    display: block;
    font-size: 21px;
    line-height: 22px;
    color: #000;
    text-decoration: underline;
}
.page2 h2,
.page3 h2 {
    position: relative;
    width: 100%;
    text-align: center;
    font-size: 22px;
    line-height: 36px;
    background: url(../images/h_bg.png) top left no-repeat;
    background-size: 26px;
    box-sizing: border-box;
    padding: 0 0;
    margin-top: 50px;
    margin-bottom: 30px;
}
.page2 h2:after,
.page3 h2:after {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    background: url(../images/h_bg2.png) bottom right no-repeat;
    background-size: 26px;
    width: 100%;
    height: 100%;
}
.page2 .text,
.page3 .text {
    width: 620px;
    margin: 40px auto 0;
    font-size: 16px;
    line-height: 22px;
}
.page2 .note,
.page3 .note,
.page4 .note {
    font-size: 12px;
    line-height: 18px;
    color: #5a5a5a;
}
.page2 .img,
.page3 .img {
    margin-top: 40px;
    
}
.page2 .inner,
.page3 .inner{
    margin: 22px auto;
    width: 620px;
}
.page2 .inner_img,
.page3 .inner_img{
    width: 38%;
    float: left;
    padding: 0 15px 15px 0;
}
figcaption {
    font-size: 12px;
    line-height: 18px;
    color: #3c3c3c;
}
figcaption.narrow {
    margin: 0 60px;
}

/*-------------
    storys
-------------*/
.storys .caption {
    width: 100%;
    margin-top: 60px;
}
.storys .inner .text{
    margin-left: 10px;
}
/*type1*/
.storys > .type1 li {
    width: 100%;
    margin-top: 30px;
    border-bottom: 1px solid #c6c6c6;
}
.storys > .type1 li:last-child {
    border-bottom: none;
}
.storys > .type1 li h3 {
    font-size: 20px;
    line-height: 28px;
    box-sizing: border-box;
    padding: 12px 0 12px 100px;
}
.storys > .type1 li.one h3 {
    background: url(../images/story_01.png) 20px top no-repeat;
    background-size: 46px;
}
.storys > .type1 li.two h3 {
    background: url(../images/story_02.png) 20px top no-repeat;
    background-size: 46px;
}
.storys > .type1 li.three h3 {
    background: url(../images/story_03.png) 20px top no-repeat;
    background-size: 46px;
}
.storys > .type1 li .inner {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin: 20px 0;
}
.storys > .type1 li .inner .img {
    width: 390px;
}
.storys > .type1 li .inner .text {
    width: 325px;
    font-size: 13px;
    line-height: 22px;
}

/*type2*/
.storys > .type2 li {
    width: 100%;
    margin-top: 30px;
    border-bottom: 1px solid #c6c6c6;
}
.storys > .type2 li:last-child {
    border-bottom: none;
}
.storys > .type2 li h3 {
    font-size: 20px;
    line-height: 28px;
    box-sizing: border-box;
    padding: 12px 0 12px 70px;
    margin-bottom: 20px;
}
.storys > .type2 li.one h3 {
    background: url(../images/story_01.png) left center no-repeat;
    background-size: 46px;
}
.storys > .type2 li.two h3 {
    background: url(../images/story_02.png) left center no-repeat;
    background-size: 46px;
}
.storys > .type2 li.three h3 {
    background: url(../images/story_03.png) left center no-repeat;
    background-size: 46px;
}
.storys > .type2 li .inner {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin: 20px 0;
}
.storys > .type2 li .inner .img {
    width: 360px;
}
.storys > .type2 li .inner .text {
    width: 325px;
    font-size: 13px;
    line-height: 22px;
}

.slide {
    opacity: 0;
    transition: all 1s ease;
}
.slide.active {
    opacity: 1;
}

/*-------------
    items
-------------*/
.items h3 {
    width: 100%;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    text-align: center;
    font-size: 16px;
    line-height: 28px;
    padding: 15px 0;
    margin-top: 80px;
}

/*type1*/
.items > .type1 {
    display: flex;
    justify-content: start;
    flex-wrap: wrap;
    margin: 0 auto 80px;
    width: 360px;
}
.items > .type1 li {
    width: 360px;
    margin: 30px 23px 0 0;
}
.items > .type1 li p {
    font-size: 12px;
    line-height: 16px;
    color: #000;
}

/*type2*/
.items > .type2 {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin: 0 auto 80px;
    width: 630px;
}
.items > .type2 li {
    width: 300px;
    margin: 30px 0 0 0;
}
.items > .type2 li p {
    font-size: 12px;
    line-height: 16px;
    color: #000;
}

/*type3*/
.items > .type3 {
    display: flex;
    justify-content: start;
    flex-wrap: wrap;
    margin-bottom: 80px;
}
.items > .type3 li {
    width: 31.25%;
    margin: 30px 3.125% 0 0;
}
.items > .type3 li:nth-child(3n)   {
    margin: 30px 0 0 0;
}
.items > .type3 li p {
    font-size: 12px;
    line-height: 16px;
    color: #000;
}

/*-------------
    shop-info
-------------*/
.items .shop-info {
    width: 630px;
    margin: 0 auto;
    background-color: #e6e6e6;
    padding: 30px;
    box-sizing: border-box;
    position: relative;
}
.items .shop-info .ttl {
    position: absolute;
    top: -20px;
    left: 20px;
    width: 58px;
}
.items .shop-info .inner {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.feature-bnr {
    width: 560px;
    margin: 50px auto;
}

/*type1*/
.items .shop-info .inner .left.type1 {
    width: 270px;
}

/*type2*/
.items .shop-info .inner .left.type2 {
    width: 270px;
    font-size: 13px;
    line-height: 22px;
}

.items .shop-info .inner .right {
    width: 250px;
    display: flex;
    flex-direction: column;
}
.items .shop-info .inner .right .text {
    font-size: 13px;
    line-height: 20px;
    /* margin-bottom: 15px; */
    margin-bottom: 35px;
}
.items .shop-info .inner .right .name {
    margin-bottom: 10px;
}
.items .shop-info .inner .right .name .genre {
    display: block;
    font-size: 12px;
    line-height: 20px;
    color: #5a5a5a;
}
.items .shop-info .inner .right .name a {
    font-size: 16px;
    line-height: 20px;
    color: #000;
    text-decoration: underline;
}
.items .shop-info .inner .right .btn {
    margin-top: auto;
}
.items .shop-info .inner .right .btn a {
    display: block;
    width: 100%;
    background-color: #000;
    color: #fff;
    text-align: center;
    padding: 10px 0;
    font-size: 14px;
    position: relative;
}
.items .shop-info .inner .right .btn a:after {
    content: ">";
    position: absolute;
    top: 50%;
    right: 30px;
    transform: translateY(-50%);
}

#contentEnd {
    position: relative;
    margin-top: 80px;
    padding-top: 55px;
    border-top: 1px solid #000;
    overflow: inherit;
}
#contentEnd .scroll-top {
    width: 37px;
    height: 37px;
    position: absolute;
    top: -50px;
    right:0;
}

/*-------------
    #fp-nav
-------------*/
#fp-nav ul li span {
  display: block;
  cursor: pointer;
  text-decoration: none;
  border-radius: 50%;
  position: absolute;
  z-index: 1;
  height: 4px;
  width: 4px;
  border: 0;
  background: #cccccc;
  left: 50%;
  top: 50%;
  margin: -2px 0 0 -2px;
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}
#fp-nav ul li.active span {
  width: 8px;
  height: 8px;
  margin: -4px 0 0 -4px;
  background: #002f80;
}
#fp-nav ul li:hover span {
  width: 10px;
  height: 10px;
  margin: -5px 0px 0px -5px;
}




/* 掲載終了時 */
.pub_end .contents .info .name a,
.pub_end .contents .items .name a{
pointer-events: none;
text-decoration: none !important;
display: block;
}
.pub_end .items{
margin-top: 80px;
}
.pub_end .items h3,
.pub_end .items ul{
display: none;
}
.pub_end .items .shop-info .inner .btn{
display: none;
}
