/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
#1.Common
1-1.common
1-2.header
1-3.footer
1-4.lower

#2.Top
2-1.hero
2-2.top-head-news
2-3.top-new
2-4.top-index
2-5.top-feature
2-6.top-bottom-news
2-7.bottom-menu

#3.Lower-support
3-1.support-lower-news
3-2.support-faq
3-3.support-contact-index
3-4.support-lower-privacy
3-5.news-index
3-6.news-details
3-7.faq-index
3-8.faq-details
3-9.contact-details
3-10.piece

#4.Lower-products
4-1.product
4-2.product-category
4-3.product-details

#5.Lower-company
5-1.company
5-2.company-outline
5-3.company-history
5-4.company-org
5-5.company-story
5-6.company-message
5-7.company-recruit

#6.Lower-funtopuzzle
6-1.funtopuzzle

#7.WordPress用
7-1. 投稿ページ用

※1000px以下のタブレット&スマホ表示の指定は各エリアの途中もしくは最下部に記載

-------------------------------------------------------
                    【#1.Common】
                     1-1.common
-------------------------------------------------------*/

.inner {
    -js-display: flex;
    display: flex;
    display: -webkit-flex;
    justify-content: space-between;
    align-items: flex-start;
}

/*4/24 追加 :start*/
blockquote {
	margin:25px;
	padding:1em 1em 1em 2em;
	background-color:#f8f8f8;
	position:relative;
}

blockquote:before {
	content:"“";
	font-size:600%;
	line-height:1em;
	color:#999;
	position:absolute;
	left:0;
	top:0;
}
/*end*/



@media screen and (max-width: 1000px) {
    .wrap {
        width: 100%;
    }

    .inner {
        display: block;
    }

    /**4/26追加*/
    .breadcrumb .inner {
        flex-wrap: wrap;
        font-size: 10px !important;
    }

    .breadcrumb .inner a {
        color: #0000cd; /*4/21 変更*/
        text-decoration: underline; /*4/21 変更*/
        margin-left: 2px !important; /*4/27追加*/
        margin-right: 2px !important; /*4/27追加*/
    }

    .breadcrumb .inner p {
        font-size: 10px !important; /*4/27変更*/
    }


    .breadcrumb strong { /*4/27追加*/
        font-weight: normal;
        margin-left: 2px !important;
    }

    .breadcrumb.hd {
    border: none;
    overflow-x: hidden;
    /* white-space: nowrap; */
    border-bottom: 1px #CCC solid;
    word-break: keep-all; /*4/27追加*/
    }

}

li {
    list-style: none;
}

h2 {
    font-size: 28px;
    margin-bottom: 40px;
}

h2 img {
    vertical-align: sub;
    margin-right: 10px;
}

a.btn {
    display: block;
    width: 200px;
    height: 30px;
    line-height: 30px;
    margin: 0 auto;
    padding: 10px;
    color: #fff;
    background: #0097c6;
    text-decoration: none;
    border-radius: 3px;
}

a.btn:hover {
    opacity: 0.7;
}

.pc {
    display: block;
}

.sp {
    display: none;
}

.breadcrumb {
    padding: 10px 0;
    border-top: 1px #333 solid;
}

.breadcrumb.hd {
    border: none;
}

.breadcrumb .inner {
    justify-content: flex-start;
    /* color:#0000cd; 4/21 変更*/
    font-size:12px;
    margin-left:10px;
}

.breadcrumb .inner a {
    color: #0000cd; /*4/21 変更*/
    text-decoration: underline; /*4/21 変更*/
    margin-left: 10px;
}

/*4/21 追加*/
.breadcrumb .inner a:hover {
    color: #ff2f7d;
    text-decoration: none;
    margin-left: 10px;
}

.breadcrumb .inner p {
    /*margin-left: 10px; 4/21無効化*/
    margin-bottom: 5px; /*4/20 追加*/
    font-size: 12px;  /*4/20 追加 4/27 修正*/
    /* color:#0000cd; 4/21追加*/
    -js-display: flex;
    display: flex; /*4/21 追加*/
    width: 100%; /*4/21 追加*/
}

hr {
    display: inline-block;
    width: 30px;
    height: 3px;
    background: #ffaaca;
    border: none;
    margin: 0 15px;
    vertical-align: middle;
}

@media screen and (max-width: 1000px) {
    body,/*3/2追記*/
    body.home,
    body.products{
        padding-top: 0
    }

    #lower-nav{
        border-top: none;
        border-bottom: none;
    }

    h2 {
        font-size: 20px;
        font-weight: normal;
        margin-bottom: 40px;
    }

    h2 img {
        width: 30px;
    }

    .pc,
    .breadcrumb {
        display: none;
    }

    .sp {
        display: block;
    }
}

/*-------------------------------------------------------
                    【#1.Common】
                     1-2.header
-------------------------------------------------------*/
.hd-left {
    width: 20%;
    text-align: left;
}

.hd-left img {
    width: 100%;
}

.hd-right {
    width: 70%;
}

.hd-right .inner {
    align-items: center;
}

.hd-right .inner.support {
    align-items: center;
    justify-content: flex-end;
}

.hd-right ul li:nth-child(5) a {
    display: block;
    background: #0097c6;
    color: #fff;
    padding: 15px 20px;
    border-radius: 5px;
    margin-right: 10px;
    border: none;
    opacity: 0.7;
}

.hd-right ul.support li:nth-child(1) a {
    display: block;
    background: #0097c6;
    color: #fff;
    padding: 15px 20px;
    border-radius: 5px;
    margin-right: 10px;
}

.hd-right ul.support li:nth-child(1) a:hover,
.hd-right ul.support li:nth-child(2) a:hover {
    border: none;
    opacity: 0.7;
}

.hd-right ul li:nth-child(5) a img {
    vertical-align: sub;
    margin-right: 5px;
}

.hd-right ul.support li:nth-child(1) a img {
    vertical-align: sub;
    margin-right: 5px;
}

.hd-right a {
    display: block;
    font-size: 14px;
    text-decoration: none;
    padding-top: 5px;
    padding-bottom: 5px;
    border-bottom: 2px #fff solid;
}

.hd-right a:hover {
    border-bottom: 2px #333 solid;
}

.hd-right .fa-instagram, .gnavi-sp .fa-instagram {
    width: 37px;
    height: 37px;
    color: #fff;
    background: linear-gradient(117deg, rgba(2,0,36,1) 0%, rgba(212,15,110,1) 61%);
    display: flex;
    font-size: 22px;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
}

.hd-right__ec-site img {
    width: 25px;
    vertical-align: middle;
    padding-right: 5px;
}

.hd-right .hd-right__sns {
    border: none;
}

.hd-right .hd-right__sns:hover {
    border: none;
}

.hd-right__twitter {
    position: relative;
}

.hd-right__twitter__popup {
    display: none;
    position: absolute;
    left: -80px;
    top: 46px;
    width: 96px;
}

.hd-right__twitter__popup img {
    display: block;
    width: 100%;
}

.hd-right__twitter:hover .hd-right__twitter__popup {
     display: block;
}

body.products .hd-right ul li:nth-child(1) a,
body.company .hd-right ul li:nth-child(2) a,
body.company-outline .hd-right ul li:nth-child(2) a,
body.company-history .hd-right ul li:nth-child(2) a,
body.company-org .hd-right ul li:nth-child(2) a,
body.company-message .hd-right ul li:nth-child(2) a,
body.company-story .hd-right ul li:nth-child(2) a,
body.company-recruit .hd-right ul li:nth-child(2) a,
body.support .hd-right ul li:nth-child(3) a,
body.support-faq .hd-right ul li:nth-child(3) a,
body.support-news .hd-right ul li:nth-child(4) a,
body.support-contact .hd-right ul li:nth-child(3) a {/*このblockはすべて2/28追記*/
    border-bottom: 2px #333 solid;
}

@media screen and (max-width: 1000px) {

    .hd-left {
        width: 100%;
        text-align: center;
    }

    .hd-left a h1{
        width: 150px;
        display: inline-block;
    }

    .hd-left a h1 img {
        width: 100%;
    }

    #gnavi-btn {
        position: fixed;
        top: 17px;
        left: 20px;
        z-index: 10001;
    }

    .gnavi-sp {
        display: none;
    }

    .gnavi-sp.display {
        position: fixed;
        top: 0;
        left: 0;
        background: rgb(255, 255, 255);
        z-index: 10000;
        display: block;
        border-top: none;
    }

    .gnavi-sp ul {
        text-align: left;
        margin: 65px 15px 0 15px;
        padding-bottom: 30px;
        width: 250px;/*3/13修正*/
        border-top: 1px #c7c7c7 solid;
    }

    .gnavi-sp ul li {
        border-bottom: 1px #c7c7c7 solid;
        padding: 15px 0;/*3/13修正*/
    }


    .gnavi-sp ul li:nth-child(5) a {
        color: #0097c6;
    }

    .gnavi-sp ul li a {
        color: #4e4e4e;
        font-size: 13px;
        text-decoration: none;
    }

    .gnavi-sp .gnavi-sp__sns {
        display: flex;
        justify-content: space-around;
    }

    body.products .gnavi-sp ul li:nth-child(1) a,
    body.company .gnavi-sp ul li:nth-child(2) a,
    body.company-outline .gnavi-sp ul li:nth-child(7) a,
    body.company-history .gnavi-sp ul li:nth-child(8) a,
    body.company-org .gnavi-sp ul li:nth-child(9) a,
    body.company-message .gnavi-sp ul li:nth-child(10) a,
    body.company-story .gnavi-sp ul li:nth-child(11) a,
    body.company-recruit .gnavi-sp ul li:nth-child(12) a,
    body.support .gnavi-sp ul li:nth-child(3) a,
    body.support-faq .gnavi-sp ul li:nth-child(7) a,
    body.support-news .gnavi-sp ul li:nth-child(4) a,
    body.support-contact .gnavi-sp ul li:nth-child(8) a { /*このblockはすべて2/28追記*/
       color: #ffaaca;
    }

    .gnavi-sp ul li.cart a img{/*2/28追記*/
        width: 17px;
        margin-right: 5px;
        vertical-align: sub;
    }

    .menu-trigger,
    .menu-trigger span {
        display: inline-block;
        transition: all .4s;
        box-sizing: border-box;
    }

    .menu-trigger {
        position: relative;
        width: 30px;
        height: 22px;
    }

    .menu-trigger span {
        position: absolute;
        left: 0;
        width: 100%;
        height: 4px;
        background-color: #ffaaca;
        border-radius: 4px;
    }

    .menu-trigger span:nth-of-type(1) {
        top: 0;
    }

    .menu-trigger span:nth-of-type(2) {
        top: 9px;
    }

    .menu-trigger span:nth-of-type(3) {
        bottom: 0;
    }

    .menu-trigger.active-btn span:nth-of-type(1) {
        -webkit-transform: translateY(9px) rotate(-45deg);
        transform: translateY(9px) rotate(-45deg);
    }

    .menu-trigger.active-btn span:nth-of-type(2) {
        opacity: 0;
    }

    .menu-trigger.active-btn span:nth-of-type(3) {
        -webkit-transform: translateY(-9px) rotate(45deg);
        transform: translateY(-9px) rotate(45deg);
    }

    .hd-search-btn {
        position: fixed;
        top: 13px;
        right: 20px;
        z-index: 10001;
    }

    .hd-search-btn a img {
        width: 30px;
    }

    .hd-search {
        display: none;
    }

    .hd-search.display-search {
        position: fixed;
        top: 57px;
        right: 0;
        width: 100%;
        background: rgb(255, 255, 255);
        z-index: 10000;
        display: block;
    }

    .hd-search .input-box,
    .hd-search .submit-btn {
        border-radius: 0;
    }

    @media screen and (max-width: 767px){/*3/13追記*/
        .gnavi-sp ul {/*3/13追記*/
            width: 150px;
        }

        .gnavi-sp ul li{/*3/13追記*/
            padding: 10px 0;
        }

        .gnavi-sp ul li a {/*3/13追記*/
            font-size: 13px;
        }
    @media screen and (max-width: 350px){/*3/6追記*/
        .gnavi-sp ul li {
            padding: 10px 0;
        }
    }
    }
}

/*-------------------------------------------------------
                    【#1.Common】
                     1-3.footer
-------------------------------------------------------*/

.top-link {
    text-align: left;
    border-top: 1px #333 solid;
    padding: 15px 0;
}

.top-link a {
    text-decoration: none;
    color: #333;
}

.top-link a:hover {
    text-decoration: underline;
}


@media screen and (max-width: 1000px) {
    .top-link {
        display: none;
    }

}

/*-------------------------------------------------------
                    【#1.Common】
                    1-4.lower
-------------------------------------------------------*/
#lower-nav{
    background: #eee;/*3/2修正*/
    border-top: 1px #ccc solid;
    border-bottom: 1px #ccc solid;/*3/2追記*/
    position: fixed;/*3/2修正*/
    top: 69px;/*3/2修正*/
    width: 100%;/*3/2修正*/
    z-index: 10000;/*3/2修正*/
}


.lower-nav {
    justify-content: space-between;
}

.lower-nav li{/*2/28修正*/
    border-left: 1px #999 solid;
    padding: 10px 0;
    text-align: center;
    width: 15%;
}

.lower-nav.support li{
    width: 25%; /*3/6修正*/
}

.lower-nav li:last-child{
    border-right: 1px #999 solid;
}

.lower-nav a {
    text-decoration: none;
    color: #000;
    font-size: 13px;
    display: block;
    text-align: center;
}

.lower-nav a:hover {
    text-decoration: underline;
}

body.support .lower-nav li:nth-child(1),
body.support-faq .lower-nav li:nth-child(2),
body.support-contact .lower-nav li:nth-child(3),
body.company .lower-nav li:nth-child(1),
body.company-outline .lower-nav li:nth-child(2),
body.company-history .lower-nav li:nth-child(3),
body.company-org .lower-nav li:nth-child(4),
body.company-message .lower-nav li:nth-child(5),
body.company-story .lower-nav li:nth-child(6),
body.company-recruit .lower-nav li:nth-child(7) {/*このblockはすべて2/28追記*/
    background: #ccc;
}

@media screen and (max-width: 1000px) {
    #lower-nav {/*3/2修正*/
        display: none;
    }
}

#hero-lower h2 {
  font-size: 24px;
  font-weight: 700;
  margin: 0;
}

@media screen and (min-width: 768px) {
  #hero-lower h2 {
    font-size: 30px;
  }
}


#hero-lower h2 span {
    font-size: 14px;
    display: block;
    margin-top: 20px;
}




@media screen and (max-width: 480px) {

}

/*-------------------------------------------------------
                    【#2.Top】
                     2-1.hero
-------------------------------------------------------*/

#hero {
    position: relative;
    width: 1000px;/*3/13項目追記*/
    margin: 0 auto;/*3/13項目追記*/
}

#hero .box {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    text-align: left;
    background: rgba(51, 51, 51, 0.5);
    padding: 20px;/*3/13項目追記*/
    color: #fff;
}

#hero img {
    width: 100%;
}

#hero h3 {
    font-size: 24px;
    font-weight: normal;
    margin-bottom: 10px;
}

#hero img.sp {
    display: none;
}

@media screen and (max-width: 1000px) {
    #hero {
        margin-top: 57px;
        width: 100%;/*3/13項目追記*/
    }

    #hero img.sp {
        display: block;
    }

    #hero .box,
    #hero img.pc {
        display: none;
    }
}

/*3/13項目削除*/

/*-------------------------------------------------------
                    【#2.Top】
                     2-2.top-head-news
-------------------------------------------------------*/

#top-head-news {
    margin-top: 50px;
}

#top-head-news .inner {
    justify-content: flex-start;
    align-items: center;
}

#top-head-news table {
    width: 100%;
}

#top-head-news th {
    background: #990066;
    color: #fff;
    padding: 10px 0;
    width: 20%;
    vertical-align: middle; /*4/25 追加*/
}

#top-head-news td {
    background: #f3f3f3;
    padding: 10px 0 10px 20px;
    width: 80%;
    line-height: 130%;
    text-align: left;
}

#top-head-news a {
    color: #333;
    display: block;
}

#top-head-news a:hover {
    opacity: 0.7;
}

@media screen and (max-width: 1000px) {
    #top-head-news {
        width: 95%;
        margin: 50px auto 0;
    }

    #top-head-news th {
        width: 20%;
        vertical-align: middle;
        font-size: 12px;
    }

    #top-head-news td {
        width: 80%;
        font-size: 12px;
    }
}

/*-------------------------------------------------------
                    【#2.Top】
                     2-3.top-new
-------------------------------------------------------*/

#top-new {
    padding: 50px 0;
}

#top-new .box{/*3/23追記*/
    width: 30%;
}

#top-new .box a {
    color: #ff2f7d;
}

#top-new .box a h4 {
    font-weight: normal;
    margin: 15px 0 10px;
}

/*3/30 一旦無効
#top-new .box p {
    display: inline-block;
    color: #333;
    font-size: 12px;
    border: 1px #333 solid;
    padding: 3px 5px;
    border-radius: 5px;
    text-decoration: none;
}
*/

/*3/30 追加 start*/
#top-new .box p.date {
    font-size: 12px;
    line-height: inherit;
    text-align: center;
    word-wrap: break-word; /*4/5 追加*/
    font-family: monospace; /*4/17 追加*/
}

#top-new .box p.tag {
    width: 40%;
    float: right;
    display: inline-block;
    color: #333;
    font-size: 12px;
    border: 1px #333 solid;
    padding: 3px 5px;
    border-radius: 5px;
    text-decoration: none;
    line-height: inherit;
}
/*3/30 追加 end*/


#top-new .box a:hover img,
#top-new .box a:hover p {
    opacity: 0.7;
}

#top-new .box a:hover h4 {
    font-weight: bold;
}

.search-box {
    padding: 30px 0 40px; /*4/21 修正*/
}

.search-box form {
    max-width: 700px;
    margin: 0 auto;
}

.input-box {
    width: 75%;
    height: 50px;
    line-height: 50px;
    background: #f3f3f3;
    border-radius: 3px 0 0 3px;
    padding: 10px 10px 10px 20px;
    border: none;
    color: #333;
    font-size: 18px;
    -webkit-appearance: none; /*2/22修正*/
}

.submit-btn {
    width: 25%;
    height: 50px;
    line-height: 50px;
    background: #0097c6 url(../img/icon_search.png) no-repeat 50px center;
    background-size: 20px;
    border-radius: 0 3px 3px 0;
    color: #fff;
    border: none;
    font-size: 18px;
    cursor: pointer;
    padding-left: 30px;
}

.submit-btn:hover {
    opacity: 0.7;
}

.popularity-box {
    max-width: 700px;
    margin: 0 auto;
}

.popularity-box .inner {
    justify-content: flex-start;
    flex-wrap: wrap;/*3/19追記*/
}

.popularity-box ul li {
    margin-left: 20px;
    margin-top: 20px;/*3/19追記*/
}

.popularity-box ul li a {
    background: #0097c6;
    padding: 5px 20px;
    border-radius: 50px;
    text-decoration: none;
    color: #fff;
    font-size: 14px;
}

.popularity-box ul li:first-child {
    margin: 0;
    margin-top: 20px;/*3/19追記*/
}

.popularity-box ul li a:hover {
    opacity: 0.7;
}

@media screen and (max-width: 1024px) {/*3/17編集*/
    #top-new {
        overflow: hidden;
    }

    #top-new .pc{/*3/17追記*/
        display: none;
    }

    #top-new p.sp{/*3/22追記*/
        display: none;
    }

    #top-new .sp{/*3/17追記*/
        -js-display: flex;
    display: flex;
    }


    #top-new .inner .inner {
        -js-display: flex;
    display: flex;
        justify-content: space-between;
        align-items: flex-start;
        width: 75%;
        margin: 0 auto;
    }

    #top-new .inner .inner .box {
        width: 45%;
    }

    #top-new .box a h4 {
        font-size: 12px;
    }

    #top-new .box a p {
        font-size: 12px;
    }

    .search-box {
        width: 95%;
        margin: 0 auto;
        display:none;
    }

    .input-box, .submit-btn {
        font-size: 14px;
    }

    .submit-btn {
        background-position: 20% center;
        background-size: 15px;
        padding-left: 20px;
    }

    .popularity-box .inner {/*3/13修正*/
        -js-display: flex;
    display: flex;
    }

    .popularity-box p.sp{
        display: none;
    }


    @media screen and (max-width: 767px){/*3/13追記*/
        .popularity-box .inner {
            -js-display: flex;
    display: flex;
            justify-content: flex-start;/*3/19修正*/
        }
        .popularity-box p {
            text-align: center;/*2/28修正*/
            margin: 25px 0 15px 10px; /*4/27 修正*/
        }

        .popularity-box ul li {
            margin-left: 10px;/*3/19修正*/
        }

        .popularity-box ul li:first-child {
            display: none;
        }

        #top-new .popularity-box p.sp,/*3/19修正*/
        .popularity-box p.sp{/*3/19追記*/
            display: block;
        }
    }
}

/*-------------------------------------------------------
                    【#2.Top】
                     2-4.top-index
-------------------------------------------------------*/

#top-index {
    padding: 50px 0;
}

#top-index .border-bottom {
    border-bottom: 2px #ffaaca solid;
    margin-bottom: 30px;
}

#top-index .border-bottom .inner {
    max-width: 600px;
    margin: 0 auto;
}

#top-index .border-bottom .inner h3 {
    width: 25%;
    font-weight: normal;
    padding: 10px 0;/*3/13修正*/
    border-top: 2px solid #ffaaca;
    border-left: 1px solid #ffaaca;
    border-right: 2px solid #ffaaca;
    }

#top-index .border-bottom .inner h3.ck1 {
    background: #ffaaca;
    color: #fff;
     border-left: 2px solid #ffaaca; /*4/27 追加*/
}

/*4/27 hoveraction 追加*/
#top-index .border-bottom .inner h3,
#top-index .border-bottom .inner h3::before,
#top-index .border-bottom .inner h3::after {
	/*-webkit-box-sizing: border-box; */
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}


#top-index .border-bottom .inner h3:hover {
    background: #ffaaca;
    color: #fff;
    cursor: pointer;
}

.content-current {
    position: relative;
}

.content1, .content2, .content3, .content4 {
    width: 100%;
    display: none;
}

.content1 {
    display: block;
}

.content-current .box{
    width: 30%;
}

.content-current .box a {
    color: #ff2f7d;
}

.content-current .box a p {
    padding: 20px 0;
}

.content-current .box a img{
    height: 212px;
}

.content-current .box a:hover img {
    opacity: 0.7;
}

.content-current .box a:hover p {
    font-weight: bold;
}

@media screen and (max-width: 1000px) {
    #top-index {
        padding: 50px 0 0;
    }

    #top-index .border-bottom {
        border-bottom: none;
        width: 95%;
        margin: 0 auto 30px;
    }

    #top-index .border-bottom .inner {
        width: 100%;
        overflow: hidden;
    }

    #top-index .border-bottom .inner h3 {
        width: 49%;/*3/13修正*/
        border: 2px #ffaaca solid;
        float: left;
    }

    #top-index .border-bottom .inner h3.ck1,
    #top-index .border-bottom .inner h3.ck3 {
        border-right: none;
    }

    #top-index .border-bottom .inner h3.ck1,
    #top-index .border-bottom .inner h3.ck2 {
        border-bottom: none;
    }

    .content-current .inner {
        -js-display: flex;
    display: flex;
        width: 95%;
        margin: 0 auto;
    }

    .content-current .box a img{
        height: auto;
    }


    .content-current .inner .box {
        width: 45%;
    }

    .content-current .inner .box img {
        width: 100%;
    }

    @media screen and (max-width: 320px){/*3/13追記*/
    #top-index .border-bottom .inner h3 {
        width: 48%;
    }
}
}

/*-------------------------------------------------------
                    【#2.Top】
                     2-5.top-feature
-------------------------------------------------------*/

#top-feature {
    padding: 50px 0;
    background: url(../img/pic_bg_puzzle.png) no-repeat center center;
    background-size: cover;
}

#top-feature .inner{/*3/19追記*/
    justify-content: flex-start;
}

#top-feature .box {
    width: 24%;
    text-align: left;
    margin-bottom: 30px;
    margin-left: 1%;/*3/19追記*/
}

#top-feature .box.long {
    width: 49%;
}

#top-feature .box a {
    color: #333;
    text-decoration: none;
}

#top-feature .box img {
    width: 100%;
}

#top-feature .box a p {
    padding: 20px 20px 0;
    height: 80px;
    background: #f8f8f8;
    font-size: 13px;
    line-height: 150%;
}

#top-feature .box a:hover img, #top-feature .box a:hover p {
    opacity: 0.7;
}

#top-feature a.btn {
    cursor: pointer;
}

@media screen and (max-width: 1000px) {
    #top-feature {
        background: url(../img/pic_bg_puzzle.png) repeat center center;
    }

    #top-feature div.inner{/*3/2追記*/
        -js-display: flex;
    display: flex;
        padding: 0 5px;
    }

    #top-feature .box{
        width: 48%;/*3/2修正*/
        margin: 0 0 30px;/*3/19修正*/
        margin-left: 1%;/*3/19追記*/
        text-align: center;
    }

    #top-feature .box a p{/*3/2追記*/
        padding: 10px 5px 0;
    }

    #top-feature .box img{
        width: 100%;
    }
}

/*-------------------------------------------------------
                    【#2.Top】
                     2-6.top-bottom-news
-------------------------------------------------------*/

#top-bottom-news {
    padding: 50px 0;
    background: #f8f8f8;
}

#top-bottom-news table {
    width: 100%;
    text-align: left;
    border-top: 1px #adadad solid;
}

#top-bottom-news a {
    color: #333;
}

#top-bottom-news a:hover {
    font-weight: bold;
    color: #000;
    transition: .3s;
}

#top-bottom-news table tr {
    border-bottom: 1px #adadad solid;
}

#top-bottom-news table tr th {
    padding: 20px 0;
    width: 15%;
    vertical-align: middle;
    font-weight: normal;
}

#top-bottom-news table tr th a {
    text-decoration: none;
}

#top-bottom-news table tr td {
    padding: 20px 0;
    width: 83%;
    vertical-align: middle;
}

#top-bottom-news table tr td.arrow {
    color: #ff2f7d;
    font-weight: bold;
    font-size: 18px;
}

#top-bottom-news a.btn {
    margin-top: 50px;
    color: #fff;
}

@media screen and (max-width: 1000px) {
    #top-bottom-news table {
        width: 90%;
        margin: 0 auto;
    }

    #top-bottom-news table tr th {
        width: 25%;
        font-size: 12px;
    }

    #top-bottom-news table tr td {
        width: 70%;
        font-size: 13px;
        line-height: 130%;
        padding: 10px 5px;
    }
}

/*-------------------------------------------------------
                    【#2.Top】
                     2-7.bottom-menu
-------------------------------------------------------*/

#bottom-menu {
    padding: 50px 0;
}

#bottom-menu a {
    width: 30%;
    border: 1px #ff2f7d solid;
    background: #f8f8f8;
    padding: 40px 0;
    color: #ff2f7d;
    text-decoration: none;
    display: block;
}

#bottom-menu a:hover {
    background: #ececec;
}

#bottom-menu a.bd-n{/*3/6追記*/
    border: none;
    background: none;
}

#bottom-menu .margin-bottom {
    margin-bottom: 30px;
}

#bottom-menu a p {
    margin: 30px 0;
}

@media screen and (max-width: 1000px) {
    #bottom-menu {
        padding: 20px 0;
    }

    #bottom-menu .inner {
        -js-display: flex;
    display: flex;
        width: 90%;
        margin: 0 auto 30px;
    }

    #bottom-menu .inner a {
        width: 45%;
        padding: 20px 0;
    }
}

/*-------------------------------------------------------
                    【#2.Top】
                     2-7.bottom-menu
-------------------------------------------------------*/
.top-banner {
    padding: 20px 0 40px;
}

.top-banner .inner {
    align-items: center;
}

.top-banner .inner a:hover {
    opacity: 0.8;
}

@media screen and (max-width: 1000px){/*3/13追記*/
    .top-banner ul.inner{
        -js-display: flex;
    display: flex;
        width: 95%;
        margin: 0 auto;
    }

    .top-banner ul.inner li{
        width: 23%;
    }

    .top-banner ul.inner li img{
        width: 100%;
    }
    @media screen and (max-width: 767px){
        .top-banner ul.inner{
            display: block;
        }

        .top-banner ul.inner li{
            margin: 0 auto;
            width: 50%;
        }
    }
}


/*-------------------------------------------------------
                    【#3.Lower】
                     3-2.support-faq
-------------------------------------------------------*/

#faq table {
    width: 100%;
    text-align: left;
    border-top: 1px #adadad solid;
}

#faq table tr {
    border-bottom: 1px #adadad solid;
}

#faq table tr th {
    padding: 20px 0;
    width: 5%;
    font-size: 18px;
    vertical-align: middle;
    font-weight: normal;
    color: #ff2f7d;
}

#faq table tr td a {
    text-decoration: none;
}

#faq table tr td {
    padding: 20px 0;
    width: 93%;
    text-align: left;
    vertical-align: middle;
}

#faq a.btn {
    margin-top: 50px;
    color: #fff;
}

@media screen and (max-width: 1000px) {
    #faq {
        padding: 30px 0;
    }

    #faq table {
        width: 90%;
        margin: 0 auto;
    }

    #faq table tr th {
        width: 8%;
        font-size: 16px;
    }

    #faq table tr td {
        width: 90%;
        font-size: 13px;
        line-height: 130%;
        padding: 10px 5px;
    }
}

/*-------------------------------------------------------
                    【#3.Lower】
                     3-3.support-contact-index
-------------------------------------------------------*/

.contact-privacy {
    margin: 50px 0;
}

.contact-privacy p {
    border: 1px #888 solid;
    height: 300px;
    overflow: scroll;
    padding: 20px;
    margin: 20px 0;
    font-size: 14px;
}

/*-------------------------------------------------------
                    【#3.Lower】
                     3-4.support-lower-privacy
-------------------------------------------------------*/

#lower-privacy {
    padding: 50px 0;
}

#lower-privacy p {
    border: 1px #333 solid;
    height: 300px;
    padding: 20px 40px;
    overflow: scroll;
    text-align: left;
    line-height: 180%;
    letter-spacing: 1px;
    font-size: 14px;
}

@media screen and (max-width: 1000px) {
    #lower-privacy {
        padding: 20px 0;
    }

    #lower-privacy p {
        width: 60%;
        margin: 0 auto;
        padding: 20px;
        line-height: 160%;
        font-size: 14px;
    }

    #lower-privacy p span {
        font-size: 16px;
    }
}

/*-------------------------------------------------------
                    【#3.Lower】
                     3-5.news-index
-------------------------------------------------------*/

.category-01,
.category-02 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    background: #fff;
    z-index: 1;
}

/*-------------------------------------------------------
                    【#3.Lower】
                     3-6.news-details
-------------------------------------------------------*/
.lower-news-details {
    text-align: left;
    margin-bottom: 50px;
}


/* 4/5 WP用に変更
start:

.lower-news-details h2 {
    text-align: center;
    margin: 50px 0 0;
}

.lower-news-details p.date {
    text-align: right;
    margin: 0 0 50px;
}

.lower-news-details h3 {
    font-size: 20px;
    position: relative;
    padding: .25em 0 .5em .75em;
    border-left: 6px solid #ffaaca;
    text-align: left;
    display: inline-block;
    width: 50%;
}

.lower-news-details h3::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 2px solid #ccc;
}

end
*/

/* 4/5 WPテンプレート用追加 :start */

.lower-news-details h1 {
  font-size: 24px;
  font-weight: 700;
}

@media screen and (min-width: 768px) {
  .lower-news-details h1 {
    font-size: 30px;
  }
}

.lower-news-details h2.title { /*4/13追加*/
    text-align: center;
    margin: 50px 0 0;
    border: none;
    display: block;
}



.lower-news-details p.date {
    text-align: right;
    margin: 0 0 50px;
}

.lower-news-details h3::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 2px solid #ccc;
}

.lower-news-details h4 {
    font-size: 14px;
    position: relative;
    padding: .20em 3em .5em 1.0em;
    border-left: 6px double #ffaaca;
    text-align: left;
    display: block; /*4/24 変更*/
    width: 40%;
    margin-top: 10px; /*4/24 追加*/
    margin-bottom: 10px; /*4/24 追加*/
}

.lower-news-details h4::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 2px solid #ccc;
}

.lower-news-details table {
    width: 100%;
    margin-bottom: 50px;
    text-align: center;
}

.lower-news-details table tr th,
.lower-news-details table tr td {
    border: 1px #999 solid;
    width: 25%;
    padding: 10px;
    vertical-align: middle;
}

.lower-news-details table tr th {
    background: #ddd;
    color: #000;
    font-weight: normal;
}

.lower-news-details ul.inner {
    width: 800px;
    margin: 0 auto 50px;
    justify-content: space-between;
}

.lower-news-details p.center {
    text-align: center;
}

.lower-news-details p.center iframe {
    width: 700px;
    height: 400px;
}

.lower-news-details a {
  color: #000;
  text-decoration: underline;
  transition: all 0.5s ease 0s;
}

.lower-news-details a:hover {
  color: #000;
  opacity: 0.7;
}

.lower-news-details a.back {
    text-align: center;
    border: 2px #0097c6 solid;
    background: #0097c6;
    display: block;
    margin: 0 auto;
    width: 200px;
    padding: 10px;
    color: #fff;
    text-decoration: none;
    border-radius: 5px;
}

.lower-news-details a.back:hover {
    opacity: 0.8;
}

.lower-news-details .product-results ul.inner {/*3/22追記*/
    margin: 30px 0;
    -js-display: flex;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
}

.lower-news-details .product-results ul.inner li {/*3/22追記*/
    width: 25%;
    margin-bottom: 40px;
    text-align: center;
    list-style: none; /*4/10 修正*/
    padding:0;
    margin-left:0;
}

.lower-news-details .product-results ul.inner li a {/*3/22追記*/
    text-decoration: none;
}

.lower-news-details .product-results ul.inner li a div{/*3/22追記*/
    padding: 20px;
    width: 180px;
    margin: 0 auto;
    border: 1px #f2f2f2 solid;
}

/*.lower-news-details .product-results ul.inner li a div.pd{3/12コメントアウト
    padding: 0 20px;
    height: 147px;
}*/

/*.lower-news-details .product-results ul.inner li a div.pd img{3/12コメントアウト
    width: 97%;
}*/

.lower-news-details .product-results ul.inner li a img {/*3/22追記*/
    width: 70%;
}

.lower-news-details .product-results ul.inner li a:hover img {/*3/22追記*/
    opacity: 0.7;
}

.lower-news-details .product-results ul.inner li a h5 {/*3/22追記*/
    color: #ff2f7d;
    margin-top: 15px;
    font-size: 14px;
    font-weight: normal;
    line-height: 150%;
}

.lower-news-details .product-results ul.inner li a:hover h5 {/*3/22追記*/
    text-decoration: underline;
}

.lower-news-details .product-results ul.inner li a ul.inner li {/*3/22追記*/
    width: 55%;
    color: #333;
    font-size: 14px;
    margin-bottom: 0;
    margin-left: inherit; /*4/18 追加*/
}

.lower-news-details .product-results ul.inner li a ul.inner li:last-child {/*3/22追記*/
    width: 30%;
    margin-left: 5px;
    font-size: 11px;
}

.lower-news-details .product-results ul.inner li a ul.inner {/*3/22追記*/
    align-items: center;
    justify-content: flex-start;
    margin: 5px 0;
    display: -webkit-box;
}

.lower-news-details .product-results ul.inner li a ul.inner li p.date {/*3/22追記*/
    text-align: right;
    margin: 0;
    padding: 0;
    font-size: 11px; /*4/18 追加*/
    line-height: inherit; /*4/18 追加*/
}

.lower-news-details .product-results ul.inner li a ul.inner li p.tag {/*3/22追記*/
    border: 1px #333 solid;
    border-radius: 2px;
    display: inline-block;
    padding: 3px 5px;
    margin: 0;
}

.lower-news-details .product-results ul.inner li a p.price {/*3/22追記*/
    color: #333;
    margin: 0;
    padding: 0;
    line-height: 100%;
    text-align: center;
    margin-top: 10px;
    font-size: 14px;
}

@media screen and (max-width: 1000px) {
    .lower-news-details {
        padding: 0 10px 20px;
        margin: 0;
    }
    .lower-news-details h2 {
        margin-top: 20px;
        /*3/2項目削除*/
    }

    .lower-news-details h2 hr {
        display: none;
    }

    .lower-news-details p.date{
        margin-bottom: 30px;
    }

    .lower-news-details h3 {
        font-size: 16px;
        width: 89%;
    }

    .lower-news-details p {
        font-size: 14px;
    }

    .lower-news-details table {
        font-size: 14px;
    }

    .lower-news-details ul.inner {
        width: 100%;
        text-align: center;
    }

    .lower-news-details ul.inner li {
        margin-bottom: 20px;
    }

    .lower-news-details p.center iframe {
        width: 100%;
        height: 400px;
    }

    .lower-news-details .product-results ul.inner{/*3/22追記*/
        margin-bottom: 20px;
        -js-display: flex;
    display: flex;
    }

    .lower-news-details .product-results ul.inner li a div{/*3/22追記*/
        padding: 20px 0;
        width: 150px;
    }

    .lower-news-details .product-results ul.inner{/*3/22追記*/
        flex-wrap: wrap;
        margin-bottom: 0;
    }

    .lower-news-details .product-results ul li a ul.inner li {/*3/22追記*/
        width: 50%;
        margin-bottom: 0;
    }

    .lower-news-details .product-results ul.inner li a ul.inner li:last-child{/*3/22追記*/
        width: 40%;
        text-align: left;
    }

    .lower-news-details .product-results ul li a ul.inner li p.tag{/*3/22追記*/
        font-size: 10px;
    }


    @media screen and (max-width: 767px) {
        .lower-news-details p.center iframe {
            width: 100%;
            height: auto;
        }

        .lower-news-details .product-results ul.inner li{/*3/22追記*/
            width: 47%;
            margin-bottom: 20px;
            margin-left: inherit; /*4/18 追加*/
        }

        @media screen and (max-width: 330px){/*3/22追記*/
            .lower-news-details .product-results ul.inner li a div{
                width: 140px;
            }

            .lower-news-details .product-results ul.inner li a h5{
                font-size: 13px;
            }

            .lower-news-details .product-results ul.inner li a ul.inner li p.date {
                font-size: 12px;
            }

            .lower-news-details .product-results ul.inner li a ul.inner li p.tag {
                font-size: 9px;
            }
        }
    }
}

/*-------------------------------------------------------
                    【#3.Lower】
                     3-7.faq-index
-------------------------------------------------------*/

.search-words {
    margin: 0;/*2/21修正*/
    padding: 20px;
    padding-top: 50px;
    border: 2px #ffaaca solid;
    position: relative;
}

.search-words h3 {
    position: absolute;
    top: 0;
    left: 0;
    background: #ffaaca;
    color: #fff;
    padding: 10px;
}

.search-words h4 {
    font-size: 18px;
    border-bottom: 3px #ffaaca solid;
    display: inline-block;
    padding-bottom: 2px;
    margin: 10px 0;
}

.search-words ul.inner {
    justify-content: flex-start;
    margin: 15px 0;
    flex-wrap: wrap;/*3/14追記*/
}

.search-words ul.inner li {
    margin-left: 15px;
}

.search-words ul.inner li a {
    display: block;/*3/14修正*/
    margin-top: 10px;
    background: #0097c6;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 13px;
    text-decoration: none;
}

.search-words ul.inner li a:hover {
    opacity: 0.7;
}

.search-bar {
    margin: 20px 0;/*2/21修正*/
    background: #ddd;
    padding: 10px 20px;
}

.search-bar a {
    color: #333;
}

.search-bar a:hover {
    color: #000;
    font-weight: bold;
}

.search-bar ul.inner {
    align-items: center;
}

.search-bar ul.inner.pc {
    -js-display: flex;
    display: flex;
}

.search-bar ul.inner.sp {
    display: none;
}

.search-bar ul li:last-child {
    width:150px;
    white-space: nowrap; /*3/31修正*/
    /*3/16項目削除*/
}

.search-bar select {
    border: none;
    width: 100%;
    height: 40px;
    font-size: 15px;
}

.search-bar select.pc {
    display: block;
}

.search-bar select.sp {
    display: none;
}

.search-results {
    margin: 30px 0;/*2/21修正*/
}

.search-results ul {
    margin: 20px 0;
}

.search-results li.inner {
    justify-content: flex-start;
    flex-wrap: wrap;/*3/14追記*/
}

.search-results li.inner p {
    margin-left: 10px;
}

.search-results li.inner p span {
    background: #0097c6;
    color: #fff;
    padding: 3px;
    border-radius: 5px;
    font-size: 11px;
    display: block;/*3/14追記*/
    margin-top: 10px;/*3/14追記*/
}

.search-results li a {
    color: #333;
    text-decoration: none;
    padding: 15px 0;
    display: block;
    border-bottom: 2px #ccc solid;
}

.search-results li a span {
    color: #ff2f7d;
    font-weight: bold;
    font-size: 16px;
    margin-right: 5px;
}

.search-results li a:hover {
    text-decoration: underline;
}

@media screen and (max-width: 1000px) {


    .search-words ul li {
        margin: 15px 0;
    }

    .search-bar {
        padding-bottom: 20px;
    }

    .search-bar ul.inner.pc {
        display: none;
    }

    .search-bar ul.inner.sp {
        -js-display: flex;
    display: flex;
        font-size: 14px;
        width: 100%;
    }

    .search-bar .inner.sp li {
        margin-bottom: 15px;
    }

    .search-bar ul li {
        margin: 10px 0;
    }

    /*3/16項目削除*/

    .search-bar .inner.sp li {
        width: 100%;
    }

    .search-bar select.pc {
        display: none;
    }

    .search-bar select.sp {
        display: block;
        padding: 5px 0;
    }

    .search-results li.inner {
        -js-display: flex;
    display: flex;
    }

    .search-words ul.inner li a{/*3/15追記*/
        display: inline-block;
    }

}

/*-------------------------------------------------------
                    【#3.Lower】
                     3-8.faq-details
-------------------------------------------------------*/

#faq-details {
    padding: 30px 0;
}

/*4/10 追加:start*/
#faq-details p {
    padding: 10px;
    margin: 20px 0;
    text-align: left;
    line-height: 160%;
    letter-spacing: 1px;
}

#faq-details h1 {/*4/27 変更*/
    text-align: center;
    margin: 30px 0 0;
    font-size: 32px;
    position: relative;
    padding: .25em 0.75em 0.3em .75em; /*4/20 変更*/
    display: table; /*4/21 変更*/
    margin: auto;
    border-bottom: 5px solid #0097c6;

    }


/* 4/27 無効化
#faq-details h2 {
    text-align: center;
    margin: 50px 0 0;
} */

#faq-details h2 { /*4/27 追加*/
    text-align: center;
    margin: 50px 0 0;
    position: relative;
    padding: .25em 0 .5em .75em;
    border-left: 6px solid #ffaaca;
    display: inline-block;
}

#faq-details h3 {
    font-size: 20px;
    position: relative;
    padding: .25em 0 .5em .75em;
    border-left: 6px solid #ffaaca;
    text-align: left;
    display: inline-block;
    /*width: 50%; 4/27無効化 */
}

#faq-details h3::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 2px solid #ccc;
}

#faq-details h4 {
    font-size: 14px;
    position: relative;
    padding: .20em 3em .5em 1.0em;
    border-left: 6px double #ffaaca;
    text-align: left;
    display: inline-block;
	margin-bottom:15px;
    /*width: 40%;*/
}

#faq-details h4::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 2px solid #ccc;
}
/*4/10 追加:end*/

.faq-pager .inner {
    justify-content: flex-end;
    align-items: center;
}

.faq-pager .inner li {
    margin-left: 20px;
}

.faq-pager .inner li a {
    border: 2px #0097c6 solid;
    color: #333;
    padding: 10px 20px;
    display: block;
    font-size: 15px;
    text-decoration: none;
}

.faq-pager .inner li a:hover {
    background: #0097c6;
    color: #fff;
}

.faq-detail .inner {
    justify-content: flex-start;
    flex-wrap: wrap;/*3/14追記*/
}

.faq-detail .inner li {
    margin-right: 10px;
    list-style-type:none; /*4/10 追加*/
    margin-left:inherit; /*4/10 追加*/
}

.faq-detail-pic .inner li {
    margin-right: 0;
}

.faq-detail .inner li span {
    background: #0097c6;
    color: #fff;
    padding: 3px;
    border-radius: 5px;
    font-size: 11px;
    display: block;/*3/14追記*/
    margin-top: 10px;/*3/14追記*/
}

/*4/10 li ol ul 追加  :start*/

.faq-detail ul {
    padding: 4px;
    text-align: left;
    line-height: 100%;
    letter-spacing: normal;
}

.faq-detail ul li {
    padding: inherit;
    text-align: left;
    line-height: 90%;
    letter-spacing: normal;
    list-style-type: inherit;
    margin-left: 40px;
    font-size: 14.5px;
}

.faq-detail ol {
    padding: 4px;
    text-align: left;
    line-height: 100%;
    letter-spacing: normal;
}

.faq-detail ol li {
    padding: inherit;
    text-align: left;
    line-height: 90%;
    letter-spacing: normal;
    list-style-type: inherit;
    margin-left: 40px;
    font-size: 14.5px;
}

/*4/10 li ol ul 追加  :end*/

.faq-details-inner {
    border: 1px #aaa solid;
    padding: 20px 30px;
    margin: 10px 0 30px;
}

.faq-detail .question {
    padding: 30px 0;
}

.faq-detail .question table th {
    color: #ff2f7d;
    font-weight: bold;
    font-size: 20px;
    margin-right: 5px;
}

.faq-detail table td {
    font-size: 16px;
    text-align: left;
    padding-left: 10px;
}

.faq-detail .answer table {
    margin-bottom: 40px;
    width:100%; /*4/27 追加*/
}

.faq-detail .answer table th {
    color: #2f95ff;
    font-weight: bold;
    font-size: 20px;
    margin-right: 5px;
    text-align: left; /*4/27追加*/
    width:10px; /*4/27追加*/
}

.faq-detail-pic .inner {
    justify-content: space-between;
}

.faq-content {
    text-align: left;
    margin: 30px 0 50px;
}

.faq-content h3 {
    font-size: 20px;
    position: relative;
    padding: .25em 0 .5em .75em;
    margin: 30px 0;
    border-left: 6px solid #ffaaca;
    text-align: left;
    display: inline-block;
    width: 30%;
}

.faq-content h3::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 2px solid #ccc;
}

.faq-content p.center {
    text-align: center !important; /*4/27変更*/
}

.faq-content p.center iframe {
    width: 700px;
    height: 400px;
}

.faq-content a {
    color: #333;
}

.faq-content a:hover {
    color: #ffaaca;
}

@media screen and (max-width: 1000px) {
    .faq-content h3{
        width: 60%;
    }

    .faq-pager .inner,
    .faq-detail .inner {
        -js-display: flex;
    display: flex;
    }

    .faq-pager .inner {
        width: 95%;
        margin: 0 auto;
        /*justify-content: space-between;*/
    }

    .faq-pager .inner li {
        margin: 0;
        margin-left: 10px;
    }

    .faq-pager .inner li a {
        padding: 5px;
        font-size: 12px;
    }

    .faq-details-inner{
        padding: 20px 10px;
    }

    .faq-detail {
        padding: 0;
    }

    .faq-detail .question table th,
    .faq-detail .answer table th {
        font-size: 18px;
    }

    .faq-detail table td {
        font-size: 15px;

    }

    .faq-detail-pic .inner {
        display: block;
        width: 80%;
        margin: 0 auto;
    }

    .faq-detail-pic .inner img {
        width: 100%;
    }

    .faq-detail-pic .inner li {
        margin-bottom: 20px;
    }

    .faq-content {
        padding: 0;
    }

    .faq-content p.center iframe {
        width: 100%;
        height: 400px;
    }

    @media screen and (max-width: 767px) {
        .faq-content p.center iframe {
            width: 100%;
            height: auto;
        }

        .faq-pager .inner{
            justify-content: space-between;
        }

        .faq-pager .inner li{
            margin: 0;
        }
    }
}


/*-------------------------------------------------------
                    【#3.Lower】
                     3-10.piece
-------------------------------------------------------*/
#piece {
    text-align: left;
    padding-bottom: 50px;
}

#piece .wrap {
    width: 800px;
}

/*4/24 追加:start*/

#piece h1 {　/*4/27 変更*/
    text-align: center;
    margin: 30px 0 0;
    font-size: 32px;
    position: relative;
    padding: .25em 0.75em 0.3em .75em; /*4/20 変更*/
    display: table; /*4/21 変更*/
    margin: auto;
    border-bottom: 5px solid #0097c6;
}

#piece h2.title { /*4/13追加*/
    text-align: center;
    margin: 50px 0 0;
    border: none;
    display: block;
}

#piece h2 { /*4/13 追加*/
    text-align: center;
    margin: 50px 0 0;
    position: relative;
    padding: .25em 0 .5em .75em;
    border-left: 6px solid #ffaaca;
    display: inline-block;
}

#piece h4 {
    font-size: 14px;
    position: relative;
    padding: .20em 3em .5em 1.0em;
    border-left: 6px double #ffaaca;
    text-align: left;
    display: block; /*4/24 変更*/
    width: 40%;
    margin-top: 10px; /*4/24 追加*/
    margin-bottom: 10px; /*4/24 追加*/
}

#piece h4::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 2px solid #ccc;
}

/* 4/10無効化 4/24追加*/
#piece h5 {
    /* text-align: center; */
    margin: 10px 0 10px 15px;
    font-size: 12px;
    position: relative;
    padding: .25em 0 .5em .75em;
    /*border-left: 3px solid #ffaaca;*/
    display: block;
}

/*4/24 追加 :end*/

#piece h3 {
    font-size: 20px;
    position: relative;
    padding: .25em 0 .5em .75em;
    margin: 50px 0 20px;
    border-left: 6px solid #ffaaca;
    text-align: left;
}

#piece h3::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 2px solid #ccc;
}

#piece h3 span {
    float: right;
    font-weight: normal;
    font-size: 16px;
}

#piece p {
    margin: 20px 0;
    line-height: 160%;
}

/* 4/10 無効化
#piece ul li {
    margin-bottom: 10px;
}
*/
/*4/5 li ol ul 追加  :start*/

#piece ul {
    padding: 4px;
    text-align: left;
    line-height: 100%;
    letter-spacing: normal;
}

#piece ul li {
    padding: inherit;
    text-align: left;
    line-height: 90%;
    letter-spacing: normal;
    list-style-type: inherit;
    margin-left: 40px;
    font-size: 15.5px;
}

#piece ol {
    padding: 4px;
    text-align: left;
    line-height: 100%;
    letter-spacing: normal;
}

#piece ol li {
    padding: inherit;
    text-align: left;
    line-height: 90%;
    letter-spacing: normal;
    list-style-type: inherit;
    margin-left: 40px;
    font-size: 15.5px;
}

/*4/5 li ol ul 追加  :end*/



@media screen and (max-width: 1000px) {
    #piece .wrap {
        width: 95%;
    }

    #piece h3 {
        font-size: 17px;
    }

    #piece p.right {
        text-align: right;
    }
}

/*-------------------------------------------------------
                    【#4.Lower-products】
                     4-1.product
-------------------------------------------------------*/
#product .sns-btn{
    justify-content: flex-end;
}

#product .sns-btn li{
    margin-left: 10px;
}

#product-index {
    background: #fff;
    padding: 50px 0;
}

#product-index .border-bottom {
    border-bottom: 2px #ffaaca solid;
    margin-bottom: 30px;
}

#product-index .border-bottom .inner {
    max-width: 600px;
    margin: 0 auto;
}

#product-index .border-bottom .inner h3 {
    width: 25%;
    font-weight: normal;
    padding: 10px;
    border-top: 2px solid #ffaaca;
    border-left: 1px solid #ffaaca;
    border-right: 2px solid #ffaaca;
}

#product-index .border-bottom .inner h3.ck1 {
    background: #ffaaca;
    color: #fff;
     border-left: 2px solid #ffaaca; /*4/27追加*/
}

/*4/27 hoveraction 追加*/
#product-index .border-bottom .inner h3,
#product-index .border-bottom .inner h3::before,
#product-index .border-bottom .inner h3::after {
	/*-webkit-box-sizing: border-box;*/
	-moz-box-sizing: border-box;
	/*box-sizing: border-box;*/
	-webkit-transition: all .3s;
	transition: all .3s;
}


#product-index .border-bottom .inner h3:hover {
    background: #ffaaca;
    color: #fff;
    cursor: pointer;
}

#product-index .content1, #product-index .content2, #product-index .content3, #product-index .content4 {
    width: 100%;
    background: #fff;
    display: none;
}

#product-index .content1{
    display: block;
}

@media screen and (max-width: 1000px) {
    #product .sns-btn{
        -js-display: flex;
    display: flex;
    }

    #product .search-box{
        padding: 30px 0;
    }

    #product-index .border-bottom {
        border-bottom: none;
        width: 95%;
        margin: 0 auto 30px;
    }

    #product-index .border-bottom .inner {
        width: 100%;
        overflow: hidden;
    }

    #product-index .border-bottom .inner h3 {
        width: 42.4%;
        border: 2px #ffaaca solid;
        float: left;
    }

    #product-index .border-bottom .inner h3.ck1,
    #product-index .border-bottom .inner h3.ck3 {
        border-right: none;
    }

    #product-index .border-bottom .inner h3.ck1,
    #product-index .border-bottom .inner h3.ck2 {
        border-bottom: none;
    }

    .content-current .inner {
        -js-display: flex;
    display: flex;
        width: 95%;
        margin: 0 auto;
    }

    .content-current .inner .box {
        width: 45%;
    }

    .content-current .inner .box img {
        width: 100%;
    }
}

/*-------------------------------------------------------
                    【#4.Lower-products】
                     4-2.product-category
-------------------------------------------------------*/

form.taxselect select { /* 4/19追加 */
    font-size: 13px !important;
    height: 25px !important;
}

.pagenav li { /*4/13 追加 4/17追加*/
    position:relative;
    display: inline-block;
    padding: 5px 3.5px; /*4/19 変更*/
    border-radius: 3px;
    /* border: solid 1px #c0c0c0; */
    background: #F5F5F5;
    /* box-shadow: inset 0px 1px 0px rgba(255,255,255, .8), 0px 1px 3px rgba(0,0,0, .1); */
    font-size: .875em;
    /* font-weight: bold;	*/
    text-decoration: none;
    color: #717171;
    margin-right: 2px;
}

.pagenav li:hover{	/*4/17 追加*/
    background-color: #717171;
}

#product-category .menu a,
#product-category div.index a {
    color: #333;
    text-decoration: none;
    border: none; /*4/17 追加*/
    display:block; /*4/18 追加*/
}

#product-category .menu .product-active,
#product-category div.index .product-active {
    color: #ff2f7d;
}

#product-category div.index {
    margin: 30px 0;
    align-items: flex-end;
}

#product-category div.index.pc{
    -js-display: flex;
    display: flex;
}

#product-category div.index .left {
    width: 85%; /*4/13 変更 4/17 変更*/
}

#product-category div.index .left ul.inner {
    justify-content: flex-start;
    align-items: flex-end;
    width: 120%; /*4/17 追加 4/19変更*/
}

#product-category div.index .left ul.inner a:hover {
    text-decoration: underline;
}

#product-category div.index .left li:nth-child(1) {
    width: 18%;
    letter-spacing: 1px;
    /*4/17 追加*/
    text-decoration: none;
    background: none;
    border: none;
}

#product-category div.index .left li:nth-child(1) span {
    font-size: 24px;
}

#product-category div.index .left li:nth-child(2) {
    width: 100%; /*3/30 変更 4/6 修正 4/13修正*/
        /*4/17 追加*/
    text-decoration: none;
    background: none;
    border: none;
}

#product-category div.index .left li:nth-child(3) {
 /*  width: 3%;   4/6 無効化*/
 }

#product-category div.index .left li:nth-child(4) {
    /* width: 38%; 4/19 変更*/
}

#product-category div.index .first {
    width: 35%; /*4/10 追加*/
    font-size: small; /*4/19 追加*/
}

#product-category div.index .previous {
    width:40%; /*4/6 追加 4/18 変更*/
    margin-right: 15px; /*4/17 追加*/
    /*margin-left: 10px;*/
    font-size: small; /*4/19 追加*/

}

#product-category div.index .next {
    width:38%; /*4/18 変更 11 → 37*/
    margin-left:10px; /*4/17 変更 4/19変更*/
    font-size: small; /*4/19 追加*/
}

#product-category div.index .last {
    width: 35%; /*4/17 変更 20 → 35 → 33*/
    font-size: small; /*4/19 追加*/
}

#product-category div.index .right {
    width: 50%;
}

#product-category div.index .right ul.inner {
    justify-content: flex-end;
    align-items: flex-end;
}

#product-category div.index .right .inner li {
    margin-left: 5px; /*4/17 追加*/
    border: none; /*4/18 追加*/
}

#product-category div.index .right .inner li a:hover {
    text-decoration: underline;
}

.product-results ul.inner {/*3/15修正*/
    margin: 30px 0;
    -js-display: flex;
    display: flex;
    flex-wrap: wrap;/*3/15追記*/
    justify-content: flex-start;/*3/16追記*/
}

.product-results ul.inner li {
    width: 25%;/*3/16修正*/
    margin-bottom: 40px;/*3/15追記*/
}

.product-results ul.inner li a {
    text-decoration: none;
}

.product-results ul.inner li a div{
    padding: 20px;
    width: 180px;/*3/16修正*/
    margin: 0 auto;
    border: 1px #f2f2f2 solid;
}

/*.product-results ul.inner li a div.pd{3/12コメントアウト
    padding: 0 20px;
    height: 147px;
}*/

/*.product-results ul.inner li a div.pd img{3/12コメントアウト
    width: 97%;
}*/

.product-results ul.inner li a img {
    width: 70%;
}

.product-results ul.inner li a:hover img {
    opacity: 0.7;
}

.product-results ul.inner li a h5 {
    color: #ff2f7d;
    margin-top: 15px;
    font-size: 14px;
    font-weight: normal;
    line-height: 150%;
}

.product-results ul.inner li a:hover h5 {
    text-decoration: underline;
}

.product-results ul.inner li a ul.inner li {
    width: 55%;
    color: #333;
    font-size: 14px;
    margin-bottom: 0;/*3/15追記*/
}

.product-results ul.inner li a ul.inner li:last-child {
    width: 30%;
    margin-left: 5px;
    font-size: 11px;
}

.product-results ul.inner li a ul.inner {
    align-items: center;
    justify-content: flex-start;
    margin: 5px 0;
}

.product-results ul.inner li a ul.inner li p.date {
    text-align: right;
    font-size: 11px; /*3/29 追記*/
    word-wrap: break-word; /*4/5 追記*/
    font-family: monospace; /* 4/17追加*/
}

.product-results ul.inner li a ul.inner li p.tag {
    border: 1px #333 solid;
    border-radius: 2px;
    display: inline-block;
    padding: 3px 5px;
    margin-right: 3px; /*4/18 追加*/
}

.product-results ul.inner li a p.price {
    color: #333;
    margin-top: 10px;
    font-size: 14px;
}

@media screen and (max-width: 1000px) {
    #product-category {
        padding: 0 5px;
    }

    #product-category .menu {
        margin-top: -30px;
    }

    #product-category div.index.pc{
        display: none;
    }

    .product-results ul.inner{
        margin-bottom: 20px;
        -js-display: flex;
    display: flex;
    }

    .product-results ul.inner li a div{
        padding: 20px 0;
        width: 150px;/*3/16追記*/
    }

    /*.product-results ul.inner li a div.pd{3/12コメントアウト
        padding: 0;
    }*/

    #product-category .menu .inner {
        -js-display: flex;
    display: flex;
    }

    #product-category .menu .inner a {
        font-size: 12px;
    }

    #product-category div.sp .line {
        -js-display: flex;
    display: flex;
        width: 300px;
        margin: 0 auto;
    }

/*4/18 追加: start*/
   #product-category div.sp .results_title {
        /* -js-display: flex;
    display: flex; */
        justify-content: flex-start;
        align-items: flex-end;
        width: 100%;
        margin-top: 20px;
    }

   #product-category div.sp .results_title li {
        display: inline;
        justify-content: flex-start;
        align-items: flex-end;
        width: 100%;
        margin-top: 0px;
        background-color: white;
        color:black;
    }
/*: end*/

    #product-category div.sp .results {
        -js-display: flex;
    display: flex;
        justify-content: flex-start;
        align-items: flex-end;
        width: 100%;
        margin-top: 20px;
        /*margin-left:25px; */ /*4/14 追加*/ /*4/17 無効化*/
    }

    #product-category div.sp .results li:nth-child(1) {
        /* width: 30%;  4/17無効化*/
        letter-spacing: 1px;
    }

    #product-category div.sp .results li:nth-child(1) span {
        /* font-size: 16px;24→16  4/14修正 4/17無効化*/
    }

    #product-category div.sp .results li:nth-child(2) {
        /* width: 41%; 3/31 修正 4/17無効化*/
        text-align: inherit; /*4/14 修正*/
    }

    #product-category div.sp .results li:nth-child(3) { /*3/31 修正*/
        /* width: 12%; 3/31 修正4/6 修正 4/17無効化*/
    }

    #product-category div.sp .results li:nth-child(4) {/*3/31 修正*/
        /* width: 5%; 3/31 修正4/6 修正 4/17無効化*/
    }

    .product-results ul.inner{/*3/15追記*/
        flex-wrap: wrap;
        margin-bottom: 0;
    }

    .product-results ul li a ul.inner li {/*3/15追記*/
        width: 50%;
        margin-bottom: 0;
    }

    .product-results ul.inner li a ul.inner li:last-child{/*3/15追記*/
        width: 40%;
        text-align: left;/*3/16追記*/
    }

    .product-results ul li a ul.inner li p.tag{/*3/15追記*/
        font-size: 10px;
    }

    @media screen and (max-width: 767px) {/*3/16修正*/
        #product-category .menu {
            margin-top: -20px;
        }

        .product-results ul.inner li{/*3/16修正*/
            width: 50%;
            margin-bottom: 20px;
        }

        @media screen and (max-width: 767px){/*3/16追記*/
            .product-results ul.inner li{
                width: 50%;/*3/19修正*/
            }

            @media screen and (max-width: 330px){/*3/22追記*/
                .product-results ul.inner li a div{
                    width: 140px;
                }

                .product-results ul.inner li a h5{
                    font-size: 13px;
                }

                .product-results ul.inner li a ul.inner li p.date {
                    font-size: 12px;
                }

                .product-results ul.inner li a ul.inner li p.tag {
                    font-size: 9px;
                }
            }

        }
    }
}

/*-------------------------------------------------------
                    【#4.Lower-products】
                     4-3.product-details
-------------------------------------------------------*/

/*4/7 追加タイトルを上部に*/
#product-details .content-text h3 {
    color: #ff2f7d;
    font-size: 30px;
    line-height: 160%;
    font-weight: normal;
    margin-top: 35px; /* 4/20 追加*/
}

.product-details-content {
    margin-top: 60px; /*4/7 変更*/
}

.product-details-content .content-img,
.product-details-content .content-text {
    width: 47%;
}

.product-details-content .content-img div{
    padding: 50px;
    border: 1px #f2f2f2 solid;
}

.product-details-content .content-img img {
    width: 100%;
}

/*4/7 追加 クレジット画像の下に*/
.product-details-content .content-img span {
    color: #333;
    font-size: 13px;
    display: block;
    margin-top: 25px;
    line-height: normal;
    float:left;
    text-align: left;
    font-family: monospace; /*4/17 追加*/
}

.product-details-content .content-img ul.inner {
    margin-top: 10px;
    justify-content: flex-start; /* 3/23追記*/
}

.product-details-content .content-img ul.inner li {
    width: 19%;
    border: 1px #f2f2f2 solid;
    margin-right: 2.7%; /* 3/23追記*/
    cursor: pointer; /* 3/23追記*/

}

.product-details-content .content-img ul.inner li a:hover {
    opacity: 0.7;
}

.product-details-content .content-text {
    text-align: left;
}

.product-details-content .content-text h3 {
    color: #ff2f7d;
    font-size: 30px;
    line-height: 160%;
    font-weight: normal;
}

.product-details-content .content-text h3 span {
    color: #333;
    font-size: 13px;
    display: block;
    margin-top: 0px; /*3/29 修正 -10から0へ*/
    line-height: normal; /*3/29 修正*/
}

.product-details-content .content-text ul.inner {
    justify-content: flex-end;
    align-items: center;
}

.product-details-content .content-text ul.sns-btn li {
    margin-left: 10px;
}

.product-details-content .content-text ul.inner li img {
    width: 100%;
}

.product-details-content .content-text ul.inner li a:hover {
    opacity: 0.7;
}

.product-details-content .content-text-title{/*2/21修正*/
    text-align: center;
    margin: 60px 0 20px;
    position: relative;
}

.product-details-content .content-text h4 {
    font-weight: normal;
    display: inline-block;/*2/21修正*/
    background: #fff;/*2/21修正*/
    z-index: 2;/*2/21修正*/
    position: relative;/*2/21修正*/
    width: 120px;/*2/21修正*/
}

.product-details-content .content-text-title hr {
    width: 100%;/*2/21修正*/
    height: 1px;
    background: #d6d6d6;
    position: absolute;/*2/21修正*/
    top: 8px;/*2/21修正*/
    left: 0;/*2/21修正*/
    right: 0;/*2/21修正*/
    z-index: 1;/*2/21修正*/
    margin: 0;/*2/21修正*/
}

.product-details-content .content-text p.text {
    line-height: 160%;
    letter-spacing: 1px;
    padding: 0 10px;/*2/21修正*/
    margin-bottom: 30px;
}

.product-details-content .content-text table{
    width: 100%;
}

.product-details-content .content-text table tr th,
.product-details-content .content-text table tr td {
    font-weight: normal;
    padding: 20px;
    font-size: 15px;
    width:1px; /*4/27 追加*/
}

.product-details-content .content-text table tr:nth-last-child(odd) th,
.product-details-content .content-text table tr:nth-last-child(odd) td {
    background: #f7f7f7;
}

.product-details-content .content-text p.price {
    font-size: 18px;
    margin: 30px 0;
    text-align: right;
}

.product-details-content .content-text p.price span {
    font-size: 25px;
}

.product-btn {
    background: #0097c6;
    color: #fff;
    display: block;
    text-align: center;
    padding: 20px;
    border-radius: 5px;
    text-decoration: none;
}

.product-btn img {
    margin-right: 10px;
    vertical-align: sub;
}

a.product-btn:hover {
    opacity: 0.7;
}

.product-details-bottom {
    margin-top: 100px;
}

#product-details h5.bottom {
    font-weight: normal;
    font-size: 28px;
    margin: 0 0 40px;
    line-height: 150%;
}

#product-details h5.bottom hr {
    width: 50px;
    background: #ff2f7d;
}

.product-details-bottom .movie{
    background: url(../img/pic_bg_puzzle.png) no-repeat center center;
    background-size: cover;
    padding: 50px 0 70px;
}

.product-details-bottom .link{
    background: #f1efef;
    padding: 50px 0 70px;
}

#product-details .relation{
    padding: 50px 0 70px;
}

.product-details-bottom ul {
    border-top: 1px #333 solid;
}

.product-details-bottom ul li {
    text-align: left;
    padding: 20px;
    border-bottom: 1px #333 solid;
}

.product-details-bottom ul li a {
    color: #333;
    font-size: 17px;
    margin-left: 10px;
}

.product-details-bottom ul li a:hover {
    font-weight: bold;
}

.product-details-bottom a.back:hover {
    font-weight: bold;
}

/* 4/4 戻るボタンの変更
.product-results a.back {
    display: block;
    text-align: right;
    margin-top: 30px;
    font-size: 20px;
    color: #333;
    text-decoration: none;
}
*/

.product-results a.back { /*4/4 戻るボタンの変更*/
    display: block;
    width: 200px;
    height: 30px;
    line-height: 30px;
    margin: 0 auto;
    padding: 10px;
    color: #fff;
    background: #0097c6;
    text-decoration: none;
    border-radius: 3px;
}


.product-results a.back:hover{
    text-decoration: underline;
}


@media screen and (max-width: 1000px) {
    #product-details {
        padding: 0 5px;
    }

    .product-details-content {
        margin-top: 20px;
    }

    .product-details-content .content-img,
    .product-details-content .content-text {
        width: 100%;
    }

    .product-details-content .content-img ul.inner,
    .product-details-content .content-text ul.inner {
        -js-display: flex;
    display: flex;
    }

    .product-details-content .content-text h3 {
        font-size: 23px;
        margin-top: 20px;
    }

    .product-details-content .content-text-title{
        padding: 0 5px;
    }

    .product-details-content .content-text p.text {
        font-size: 14px;
        padding: 0 10px;
    }

    .product-details-content .content-text table {
        width: 100%;
    }

    .product-details-content .content-text table tr th,
    .product-details-content .content-text table tr td {
        font-size: 13px;
        padding: 15px;
    }

    .product-details-content .content-text table tr:nth-last-child(odd) th,
    .product-details-content .content-text table tr:nth-last-child(odd) td {
        background: #f7f7f7;
    }

    .product-details-content .content-text p.price {
        font-size: 13px;
        margin-right: 15px;
    }

    .product-details-content .content-text p.price span {
        font-size: 19px;
    }

    .product-details-bottom h5 {
        font-size: 20px;
    }

    .product-results.sp{
        margin-bottom: 30px;
    }

    @media screen and (max-width: 580px) {

        .product-details-bottom iframe{
            width: 100%;
            height: 300px;
        }

        @media screen and (max-width: 480px) {
            .product-details-content .content-text h4 hr {
                width: 30vw;
            }

            .product-details-content
            .product-btn {
                font-size: 14px;
            }

            @media screen and (max-width: 340px) {
                .product-details-content .content-text h4 hr {
                    width: 28vw;
                }
            }
        }
    }
}

/*-------------------------------------------------------
                    【#5.Lower-company】
                     5-1.company
-------------------------------------------------------*/

#company .inner {
    -js-display: flex;
    display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
    margin: 0 -25px;
  padding: 0;
  list-style: none;
  text-align: center;
}

#company .inner p {
  text-align: center;
}

#company .inner li {
   width: calc(100% / 3);
  padding-left: 25px;
  padding-right: 25px;
  margin-top: 30px;
}

#company .inner li a {
    width: 100%;
    border: 1px #ff2f7d solid;
    padding: 40px 0;
    color: #ff2f7d;
    text-decoration: none;
    display: block;
}

#company .inner li a:hover {
    background: #f8f8f8;
}

#company .margin-bottom {
    margin-bottom: 30px;
}

#company a p {
    margin: 20px 0;
}

#company a img{
    width: 60px;
    height: auto;
}

#company .company-news {
    padding: 50px 0;
}

#company .company-news table {
    width: 100%;
    text-align: left;
    border-top: 1px #adadad solid;
}

#company .company-news a {
    color: #333;
}

#company .company-news a:hover {
    font-weight: bold;
    color: #000;
    transition: .3s;
}

#company .company-news table tr {
    border-bottom: 1px #adadad solid;
}

#company .company-news table tr th {
    padding: 20px 0;
    width: 15%;
    vertical-align: middle;
    font-weight: normal;
}

#company .company-news table tr th a {
    text-decoration: none;
}

#company .company-news table tr td {
    padding: 20px 0;
    width: 83%;
    vertical-align: middle;
}

#company .company-news table tr td.arrow {
    color: #ff2f7d;
    font-weight: bold;
    font-size: 18px;
}

#company .company-news a.btn {
    margin-top: 50px;
    color: #fff;
}


@media screen and (max-width: 1064px) {

    #company .inner {
      margin-left: -8px;
      margin-right: -8px;
    }

    #company .inner li {
      width: 50%;
      padding-left: 8px;
      padding-right: 8px;
    }

    #company .inner a {
        width: 45%;
        padding: 20px 0;
    }

    #company .company-news {
        padding: 10px 0;
    }

    #company .company-news table {
        width: 90%;
        margin: 0 auto;
    }

    #company .company-news table tr th {
        width: 25%;
        font-size: 12px;
    }

    #company .company-news table tr td {
        width: 70%;
        font-size: 13px;
        line-height: 130%;
        padding: 10px 5px;
    }
}

/*-------------------------------------------------------
                    【#5.Lower-company】
                     5-2.company-outline
-------------------------------------------------------*/

#company-outline {
    padding: 30px 0 60px;
}

#company-outline table {
    width: 100%;
    margin: 0 auto;
    text-align: left;
}

#company-outline table tr {
    border-bottom: 2px #aaa solid;
}

#company-outline table tr th {
    width: 30%;
    padding: 20px;
    vertical-align: middle;
}

#company-outline table tr td {
    width: 70%;
    padding: 20px;
    line-height: 150%;
}

#company-outline table tr td a {
    color: #ffaaca;
    text-decoration: none;
}

#company-outline table tr td a:hover {
    text-decoration: underline;
}

#company-outline table tr td img{
    width: 50%;/*2/24修正*/
}


/*4/24 li ol ul 追加  :start*/

#company-outline ul {
    padding: 4px;
    text-align: left;
    line-height: 100%;
    letter-spacing: normal;
}

#company-outline ul li {
    padding: inherit;
    text-align: left;
    line-height: 90%;
    letter-spacing: normal;
    list-style-type: inherit;
    margin-left: 40px;
    font-size: 14.5px;
}

#company-outline ol {
    padding: 4px;
    text-align: left;
    line-height: 100%;
    letter-spacing: normal;
}

#company-outline ol li {
    padding: inherit;
    text-align: left;
    line-height: 90%;
    letter-spacing: normal;
    list-style-type: inherit;
    margin-left: 40px;
    font-size: 14.5px;
}

/*4/24 li ol ul 追加  :end*/



@media screen and (max-width: 730px) {
    #company-outline table {
        width: 95%;
        font-size: 14px;
    }

    #company-outline table tr th {
        width: 20%;
        padding: 20px 0;
        text-align: center;
    }

    #company-outline table tr td {
        width: 80%;
    }

}

/*-------------------------------------------------------
                    【#3.Lower-company】
                     5-3.company-history
-------------------------------------------------------*/
#company-history {
    padding: 30px 0 60px;
}


/*4/24追加 start*/

#company-history h1 { /*4/27 変更*/
    text-align: center;
    margin: 30px 0 0;
    font-size: 32px;
    position: relative;
    padding: .25em 0.75em 0.3em .75em; /*4/20 変更*/
    display: table; /*4/21 変更*/
    margin: auto;
    border-bottom: 5px solid #0097c6;
}

#company-history h2.title { /*4/13追加*/
    text-align: center;
    margin: 50px 0 0;
    border: none;
    display: block;
}

#company-history h2 { /*4/13 追加*/
    text-align: center;
    margin: 50px 0 0;
    position: relative;
    padding: .25em 0 .5em .75em;
    border-left: 6px solid #ffaaca;
    display: inline-block;
}


#company-history h3 {
    font-size: 20px;
    position: relative;
    padding: .25em 0 .5em .75em;
    border-left: 6px solid #ffaaca;
    text-align: left;
    display: inline-block;
    width: 50%;
}

#company-history h3::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 2px solid #ccc;
}

#company-history h4 {
    font-size: 14px;
    position: relative;
    padding: .20em 3em .5em 1.0em;
    border-left: 6px double #ffaaca;
    text-align: left;
    display: block; /*4/24 変更*/
    width: 40%;
    margin-top: 10px; /*4/24 追加*/
    margin-bottom: 10px; /*4/24 追加*/
}

#company-history h4::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 2px solid #ccc;
}

/* 4/10無効化 4/24追加*/
#company-history h5 {
    /* text-align: center; */
    margin: 10px 0 10px 15px;
    font-size: 12px;
    position: relative;
    padding: .25em 0 .5em .75em;
    /*border-left: 3px solid #ffaaca;*/
    display: block;
}

/*:end*/


#company-history table {
    width: 100%;
    margin: 0 auto;
    text-align: left;
}

#company-history table tr th,
#company-history table tr td {
    border: 1px #aaa solid;
    padding: 20px;
}

#company-history table tr th {
    width: 30%;
}

#company-history table tr th.short {
    padding: 10px;
    text-align: center;
    background: #ddd;
    color: #000;
}

#company-history table tr td {
    width: 70%;
}

/*4/24 li ol ul 追加  :start*/

#company-history ul {
    padding: 4px;
    text-align: left;
    line-height: 100%;
    letter-spacing: normal;
}

#company-history ul li {
    padding: inherit;
    text-align: left;
    line-height: 90%;
    letter-spacing: normal;
    list-style-type: inherit;
    margin-left: 40px;
    font-size: 14.5px;
}

#company-history ol {
    padding: 4px;
    text-align: left;
    line-height: 100%;
    letter-spacing: normal;
}

#company-history ol li {
    padding: inherit;
    text-align: left;
    line-height: 90%;
    letter-spacing: normal;
    list-style-type: inherit;
    margin-left: 40px;
    font-size: 14.5px;
}

/*4/24 li ol ul 追加  :end*/


@media screen and (max-width: 730px) {
    #company-history table {
        width: 95%;
        font-size: 13px; /*2/28修正*/
    }

    #company-history table tr th {/*2/28追記*/
        width: 25%;
        padding: 15px 10px;
    }

    #company-history table tr td {/*2/28追記*/
        width: 75%;
        padding: 15px;
    }


}

/*-------------------------------------------------------
                    【#5.Lower-company】
                     5-4.company-org
-------------------------------------------------------*/

#company-org {
    padding: 10px 0 40px;
}

#company-org img {
    width: 60%;
}

#company-org p{ /*2/24追加*/
    text-align: right;
}

@media screen and (max-width: 767px) {
    #company-org img {
        width: 95%;
    }

    #company-org p{ /*2/24追加*/
        font-size: 14px;
        margin-top: 20px;
    }

}

/*-------------------------------------------------------
                    【#5.Lower-company】
                     5-5.company-story
-------------------------------------------------------*/
#company-story {
    padding: 10px 0 40px;
}

/*4/24追加 start*/

#company-story h1 {/*4/27 変更*/
    text-align: center;
    margin: 30px 0 0;
    font-size: 32px;
    position: relative;
    padding: .25em 0.75em 0.3em .75em; /*4/20 変更*/
    display: table; /*4/21 変更*/
    margin: auto;
    border-bottom: 5px solid #0097c6;
}

#company-story h2.title { /*4/13追加*/
    text-align: center;
    margin: 50px 0 0;
    border: none;
    display: block;
}

#company-story h2 { /*4/13 追加*/
    text-align: center;
    margin: 50px 0 0;
    position: relative;
    padding: .25em 0 .5em .75em;
    border-left: 6px solid #ffaaca;
    display: inline-block;
}


#company-story h4 {
    font-size: 14px;
    position: relative;
    padding: .20em 3em .5em 1.0em;
    border-left: 6px double #ffaaca;
    text-align: left;
    display: block; /*4/24 変更*/
    width: 40%;
    margin-top: 10px; /*4/24 追加*/
    margin-bottom: 10px; /*4/24 追加*/
}

#company-story h4::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 2px solid #ccc;
}

/* 4/10無効化 4/24追加*/
#company-story h5 {
    /* text-align: center; */
    margin: 10px 0 10px 15px;
    font-size: 12px;
    position: relative;
    padding: .25em 0 .5em .75em;
    /*border-left: 3px solid #ffaaca;*/
    display: block;
}

/*:end*/

#company-story p {
    line-height: 150%;
    text-align: left;
    margin-bottom: 20px;
}

#company-story p.center {
    text-align: center;
    font-size: 18px;
    padding: 0 10px;
}

#company-story .inner {
    margin: 30px 0;
    justify-content: space-between;
    text-align: center;
}

#company-story .inner:last-child {
  margin-bottom: 0;
}

#company-story .inner li {
    width: 60%;
    list-style-type:none; /*4/24 追加*/
}

#company-story table {
    text-align: left;
    margin: 0 0 0 10px;
    width: 100%;
}

#company-story table tr {
    border-bottom: 1px #ccc solid;
}

#company-story table tr th {
    width: 20%;
    padding: 20px 10px;
    font-size: 18px;
}

#company-story table tr td {
    width: 80%;
    padding: 10px;
    font-size: 18px;
}

#company-story .inner li:last-child{
    width: 35%;
}

#company-story .inner li img {
    width: 100%;
}


/*4/24 li ol ul 追加  :start*/

#company-story ul {
    padding: 4px;
    text-align: left;
    line-height: 100%;
    letter-spacing: normal;
}

#company-story ul li {
    padding: inherit;
    text-align: left;
    line-height: 113%; /*4/24 変更*/
    letter-spacing: normal;
    list-style-type: inherit;
   /* margin-left: 40px; */
    /* font-size: 14.5px; */
}

#company-story ol {
    padding: 4px;
    text-align: left;
    line-height: 100%;
    letter-spacing: normal;
}

#company-story ol li {
    padding: inherit;
    text-align: left;
    line-height: 90%;
    letter-spacing: normal;
    list-style-type: inherit;
    margin-left: 40px;
    font-size: 14.5px;
}

/*4/24 li ol ul 追加  :end*/



@media screen and (max-width: 1000px) {
    #company-story .inner {
        -js-display: flex;
    display: flex;
    }

    @media screen and (max-width: 820px) {
        .story-content {
            width: 100%;/*2/24修正*/
        }

        #company-story table {
            margin-left: 0;
        }

        #company-story table tr th,
        #company-story table tr td {
            padding: 5px;
            font-size: 15px;
        }

        @media screen and (max-width: 767px) {
            #company-story {/*2/24追記*/
                padding: 10px 10px 40px;
            }

            #company-story p.center {
                font-size: 16px;
                padding: 0;/*2/24追記*/
            }

            #company-story .inner {
                display: block;
            }

            #company-story .inner li {
                width: 100%;/*2/24修正*/
                margin: 0 auto 20px;
            }

            #company-story .inner li:last-child{/*2/24追記*/
                width: 100%;
            }

        }
    }
}

/*-------------------------------------------------------
                    【#5.Lower-company】
                     5-6.company-message
-------------------------------------------------------*/

.company-message-top img {
    width: 100%;
    margin-top: -40px;
}

#company-message{
    margin-top: 60px;
}

/*4/24追加 start*/

#company-message h1 {/*4/27 変更*/
    text-align: center;
    margin: 30px 0 0;
    font-size: 32px;
    position: relative;
    padding: .25em 0.75em 0.3em .75em; /*4/20 変更*/
    display: table; /*4/21 変更*/
    margin: auto;
    border-bottom: 5px solid #0097c6;
}


#company-message h2.title { /*4/13追加*/
    text-align: center;
    margin: 50px 0 0;
    border: none;
    display: block;
}

#company-message h2 { /*4/13 追加*/
    text-align: center;
    margin: 50px 0 0;
    position: relative;
    padding: .25em 0 .5em .75em;
    border-left: 6px solid #ffaaca;
    display: inline-block;
}


#company-message h4 {
    font-size: 14px;
    position: relative;
    padding: .20em 3em .5em 1.0em;
    border-left: 6px double #ffaaca;
    text-align: left;
    display: block; /*4/24 変更*/
    width: 40%;
    margin-top: 10px; /*4/24 追加*/
    margin-bottom: 10px; /*4/24 追加*/
}

#company-message h4::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 2px solid #ccc;
}

/* 4/10無効化 4/24追加*/
#company-message h5 {
    /* text-align: center; */
    margin: 10px 0 10px 15px;
    font-size: 12px;
    position: relative;
    padding: .25em 0 .5em .75em;
    /*border-left: 3px solid #ffaaca;*/
    display: block;
}

/*:end*/


#company-message .wrap {
    text-align: left;
}

#company-message .wrap p.top-text {
    margin: 40px 0 60px;
    line-height: 185%;
    letter-spacing: 1px;
}

#company-message p.title {
    font-weight: bold;
    color: #333;
    text-align: center;
    margin: 80px 0 40px;
    font-size: 24px;
}

#company-message .wrap p.text {
    line-height: 185%;
}

#company-message .wrap ul.inner li.text {
    width: 55%;
    list-style-type: none; /*4/24 追加*/
}

#company-message .wrap ul.inner li.img {
    width: 43%;
     list-style-type: none; /*4/24追加*/
}

#company-message .wrap ul.inner li.img img{
    width: 100%;
}

#company-message .wrap div.inner {
    width: 700px;
    margin: 40px auto;
}

#company-message .wrap div.inner img {
    width: 45%;
    display: block;
}

#company-message .message-bottom{/*3/2追記*/
    border-top: 2px #aaa solid;
    text-align: center;
    margin-bottom: 30px;
}

#company-message .message-bottom h3{/*3/2追記*/
    margin: 30px;
    font-size: 20px;
    display:inline-block; /*4/24 追加*/
}

/*4/24 li ol ul 追加  :start*/

#company-message ul {
    padding: 4px;
    text-align: left;
    line-height: 100%;
    letter-spacing: normal;
}

#company-message ul li {
    padding: inherit;
    text-align: left;
    line-height: 90%;
    letter-spacing: normal;
    list-style-type: inherit;
   /* margin-left: 40px; */
  /* font-size: 14.5px; */
}

#company-message ol {
    padding: 4px;
    text-align: left;
    line-height: 100%;
    letter-spacing: normal;
}

#company-message ol li {
    padding: inherit;
    text-align: left;
    line-height: 90%;
    letter-spacing: normal;
    list-style-type: inherit;
    margin-left: 40px;
    font-size: 14.5px;
}

/*4/24 li ol ul 追加  :end*/




@media screen and (max-width: 1000px) {
    #company-message {
        padding: 0 10px;
    }

    #company-message .wrap div.inner,
    #company-message .wrap ul.inner {
        display: block;
        font-size: 14px;
    }

    #company-message .wrap p.top-text {
        margin: 20px 0;
        font-size: 15px;
    }

    #company-message .wrap ul.inner{
        margin-bottom: 30px;
    }

    #company-message p.title {
        margin: 40px 0 20px;
        font-size: 18px;
    }

    #company-message .wrap ul.inner li.text,
    #company-message .wrap ul.inner li.img {
        width: 100%;
        margin-bottom: 20px;
    }

    #company-message .wrap div.inner img {
        margin: 0 auto 20px;
        width: 100%;
    }

    /*3/13項目削除*/
}

/*-------------------------------------------------------
                    【#5.Lower-company】
                     5-7.company-recruit
-------------------------------------------------------*/

/*4/24追加 start*/

#company-recruit h1 {/*4/27 変更*/
    text-align: center;
    margin: 30px 0 0;
    font-size: 32px;
    position: relative;
    padding: .25em 0.75em 0.3em .75em; /*4/20 変更*/
    display: table; /*4/21 変更*/
    margin: auto;
    border-bottom: 5px solid #0097c6;
}

#company-recruit h2.title { /*4/13追加*/
    text-align: center;
    margin: 50px 0 0;
    border: none;
    display: block;
}

#company-recruit h2 { /*4/13 追加*/
    text-align: center;
    margin: 50px 0 0;
    position: relative;
    padding: .25em 0 .5em .75em;
    border-left: 6px solid #ffaaca;
    display: inline-block;
}


#company-recruit h4 {
    font-size: 14px;
    position: relative;
    padding: .20em 3em .5em 1.0em;
    border-left: 6px double #ffaaca;
    text-align: left;
    display: block; /*4/24 変更*/
    width: 40%;
    margin-top: 10px; /*4/24 追加*/
    margin-bottom: 10px; /*4/24 追加*/
}

#company-recruit h4::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 2px solid #ccc;
}

/* 4/10無効化 4/24追加*/
#company-recruit h5 {
    /* text-align: center; */
    margin: 10px 0 10px 15px;
    font-size: 12px;
    position: relative;
    padding: .25em 0 .5em .75em;
    /*border-left: 3px solid #ffaaca;*/
    display: block;
}

/*:end*/



#company-recruit h3 {
    font-weight: normal;
    font-size: 28px;
    margin: 50px 0 20px;
}

#company-recruit h3 hr {
    width: 50px;
    background: #ff2f7d;
}

#company-recruit table tr th,
#company-recruit table tr td {
    text-align: left;
    border: 1px #aaa solid;
    padding: 15px;
}

#company-recruit table tr th {
    width: 25%;
    font-weight: normal;
    background: #ddd;
    vertical-align: middle;
}

#company-recruit table tr td {
    line-height: 150%;
}

#company-recruit table tr td a {
    color: #ff2f7d;
    text-decoration: none;
}

#company-recruit table tr td a:hover {
    text-decoration: underline;
}

#company-recruit p.text-bottom {
    text-align: center;
    font-size: 18px;
    margin-bottom: 100px;
}

#company-recruit p.text-btn {
    margin-bottom: 10px;
    font-size: 13px;
}

#company-recruit a.recruit-btn {
    display: block;
    width: 200px;
    margin: 0 auto 50px;
    border: 2px #0097c6 solid;
    border-radius: 5px;
    background: #0097c6;
    color: #fff;
    padding: 10px;
    text-decoration: none;
}

#company-recruit a.recruit-btn:hover {
    opacity: 0.7;
}

/*4/24 li ol ul 追加  :start*/

#company-recruit ul {
    padding: 4px;
    text-align: left;
    line-height: 100%;
    letter-spacing: normal;
}

#company-recruit ul li {
    padding: inherit;
    text-align: left;
    line-height: 90%;
    letter-spacing: normal;
    list-style-type: inherit;
    margin-left: 40px;
    font-size: 14.5px;
}

#company-recruit ol {
    padding: 4px;
    text-align: left;
    line-height: 100%;
    letter-spacing: normal;
}

#company-recruit ol li {
    padding: inherit;
    text-align: left;
    line-height: 90%;
    letter-spacing: normal;
    list-style-type: inherit;
    margin-left: 40px;
    font-size: 14.5px;
}

/*4/24 li ol ul 追加  :end*/

#company-recruit hr {
  width: 100%;
}

@media screen and (max-width: 1000px) {
    #company-recruit {
        padding: 0 10px;
        font-size: 14px;
    }
}

/*-------------------------------------------------------
                    【#6.Lower-funtopuzzle】
                     6-1.funtopuzzle
-------------------------------------------------------*/
#funtopuzzle {
    padding: 0 0 80px;
    text-align: center;
}

#funtopuzzle .top-text{
    background: url(../img/pic_bg_puzzle.png) repeat center center;
    padding: 80px 0;
    margin-top: -40px;
    line-height: 200%;
}

#funtopuzzle .title p{
    background: url(../img/pic_btn_y.png) no-repeat center center;
    background-size: 100% 100%; /*4/18 修正*/
    display: inline-block;
    padding: 30px 20px;
    font-weight: bold;
}

#funtopuzzle .yanoman-channel .title p{
    margin: 0 0 50px;
}

#funtopuzzle .yanoman-channel{
    padding: 50px 0 80px;
    background: #f8f8f8;
}

#funtopuzzle .yanoman-channel p{
    line-height: 200%;
    margin: 40px 0;
    letter-spacing: 1px;
}

#funtopuzzle .yanoman-channel a.btn{
    width: 260px;
}

#funtopuzzle .puzzle-online{
    padding: 60px 0 30px;/*3/14修正*/
}

#funtopuzzle .puzzle-online ul.inner{
    margin: 70px 0 0;
    justify-content: space-between;
    align-items: center;
}

#funtopuzzle .puzzle-online ul.inner li{
    width: 47%;
    text-align: left;
    letter-spacing: 1px;
}

#funtopuzzle .puzzle-online ul.inner li img{
    width: 100%;
}

#funtopuzzle .puzzle-online ul.inner li a.btn{
    margin: 0;
    margin-top: 40px;
    width: 250px;
    text-align: center;
}

#funtopuzzle .puzzle-online ul.inner li ul.inner{
    width: 80%;
    margin-top: 30px;
    align-items: flex-start;
}

#funtopuzzle .puzzle-online ul.inner li ul li{
    width: 70%;
    font-size: 11px;
}

#funtopuzzle .puzzle-online ul.inner li ul li:last-child{
    width: 28%;
}

#funtopuzzle .howto{
    padding: 60px 0 80px;
    background: #f8f8f8;
}

#funtopuzzle .howto ul.inner{
    margin: 70px 0 0;
    justify-content: space-between;
    align-items: center;
}

#funtopuzzle .howto ul.inner li{
    width: 48%;
    text-align: left;
    line-height: 180%;
    letter-spacing: 1px;
}

#funtopuzzle .howto ul.inner img{ /*4/18 追加*/
    width: 100%;
}

#funtopuzzle .howto ul.inner li iframe{
    width: 100%;
    height: 250px;
}

#funtopuzzle .howto ul.inner li a{/*3/13追記*/
    margin: 0 auto;
    margin-top: 40px;
    width: 200px;
    text-align: center;
}

#funtopuzzle .top-text{
    background: url(../img/pic_bg_puzzle.png) repeat center center;
    padding: 80px 0;
    margin-top: -40px;
    line-height: 200%;
}

#funtopuzzle .blog{
    background: url(../img/pic_bg_puzzle.png) repeat center center;
    padding: 80px 0;
}

#funtopuzzle .blog ul.inner{
    margin: 20px 0;
    justify-content: flex-start;/*3/23追記*/

}

#funtopuzzle .blog ul.inner li a{
    color: #5c5c5c;
    text-decoration: none;
}

#funtopuzzle .blog ul.inner li a:hover{
    opacity: 0.8;
}

#funtopuzzle .blog ul.inner li{
    width: 23%;
    margin-right: 2.7%;/*3/23追記*/
    background: #f8f8f8;
}

#funtopuzzle .blog ul.inner li:last-child{
    margin: 0;
}

#funtopuzzle .blog ul.inner li img{
    width: 100%;
}

#funtopuzzle .blog ul.inner li ul{
    justify-content: space-around;
    align-items: center;
    text-align: left;
    margin: 20px 0;
}

#funtopuzzle .blog ul.inner li ul li{
    font-size: 14px;
    width: 40%;
}

#funtopuzzle .blog ul.inner li ul li:last-child{
    text-align: right;
}

#funtopuzzle .blog ul.inner li h5 {
    font-size: 18px;
    text-align: left;
    padding: 0 10px;
    margin: 20px 0;
    font-weight: normal;
}

#funtopuzzle .blog ul.inner li p{
    font-size: 15px;
    text-align: left;
    margin: 10px 0 20px;
    padding: 0 10px;
    line-height: 150%;
    letter-spacing: 1px;
}

#funtopuzzle .blog a.btn{
    margin-top: 70px;
    cursor: pointer;
}

#funtopuzzle .rec{
    padding: 60px 0;/*3/14修正*/
}

#funtopuzzle .rec .title{
    margin: 0 0 60px;
}

#funtopuzzle .rec .title p{
    background: url(../img/pic_btn_y_short.png) no-repeat center center;
    background-size: 100%;
}

@media screen and (max-width: 1000px) {
    #funtopuzzle {/*3/8修正*/
        padding: 0 0 20px;
    }

    #funtopuzzle .top-text{/*3/8追記*/
        padding: 50px 20px;
    }

    #funtopuzzle .title p{/*3/8修正*/
        background-size: 250px;
        padding: 30px 0;
        width: 100%;
    }

    #funtopuzzle iframe{/*3/13修正*/
        width: 80%;
        height: 330px;
    }

    #funtopuzzle .howto ul.inner li:nth-child(2),
    #funtopuzzle .puzzle-online ul.inner li{/*3/13追記*/
        text-align: center;
    }

    #funtopuzzle .howto ul.inner li iframe{/*3/13追記*/
        width: 80%;
        height: 300px;
    }

    #funtopuzzle .puzzle-online ul.inner li img{
        width: 80%;
    }

    #funtopuzzle .puzzle-online,
    #funtopuzzle .howto,
    #funtopuzzle .yanoman-channel{/*3/8追記*/
        padding: 50px 20px;
    }

    #funtopuzzle .puzzle-online ul.inner li,
    #funtopuzzle .howto ul.inner li{/*3/8追記*/
        width: 100%;
    }

    #funtopuzzle .puzzle-online ul.inner li:last-child{/*3/8追記*/
        margin-top: 20px;
    }

    #funtopuzzle .puzzle-online ul.inner li ul.inner{/*3/8追記*/
        -js-display: flex;
    display: flex;
        width: 100%;
        align-items: flex-start;
    }

    #funtopuzzle .puzzle-online ul.inner li ul.inner li:last-child{/*3/8追記*/
        margin: 0;
    }

    #funtopuzzle .puzzle-online ul.inner li a.btn{/*3/8追記*/
        margin: 40px auto 0;
    }

    #funtopuzzle .howto ul.inner{/*3/8追記*/
        margin-top: 50px;
    }

    #funtopuzzle .howto ul.inner li.sp{/*3/8追記*/
        margin-top: 10px;
    }

    #funtopuzzle .blog{/*3/8追記*/
        padding: 50px 10px;
    }

    #funtopuzzle .blog ul.inner{/*3/8追記*/
        -js-display: flex;
    display: flex;
    }

    #funtopuzzle .blog ul.inner li{/*3/8追記*/
        width: 47%;
        margin-right: 6%;/*3/23追記*/
    }

    #funtopuzzle .blog ul.inner li:nth-child(even){/*3/23追記*/
        margin: 0;
    }

    #funtopuzzle .blog ul.inner li ul.inner{/*3/8追記*/
        display: block;
    }

    #funtopuzzle .blog ul.inner li ul.inner li{/*3/8追記*/
        width: 80%;
        padding: 0 10px;
        text-align: left;
        margin-bottom: 5px;
    }

    #funtopuzzle .blog ul.inner li h5{/*3/8追記*/ /*3/31修正*/
        margin: 5px 0 15px;
    }

    #funtopuzzle .product-results ul li {/*3/8追記*/
        width: 50%;
    }

    #funtopuzzle .rec .title p{/*3/8修正*/
        background-size: 120px;
        padding: 30px 0;
        width: 100%;
    }

    @media screen and (max-width: 767px){/*3/13追記*/
        #funtopuzzle iframe,
        #funtopuzzle .howto ul.inner li iframe{
            width: 100%;
            height: 190px;
        }

        #funtopuzzle .puzzle-online ul.inner li img{
            width: 100%;
        }

        #funtopuzzle .puzzle-online ul.inner li{
            text-align: left;
        }
    }
        #funtopuzzle .product-results ul.inner li a ul.inner{/*3/24修正*/
       flex-wrap: nowrap;
       }
}