@charset "UTF-8";
figure{margin: 0;}
#Wrap {width: 100%;}
#Contents-All .img-width {width: 100%;}
#Contents-All a {display: block;}
#Contents-All {font-feature-settings: 'palt'; text-align: justify; text-justify: inter-ideograph;} 
#Contents-All img {display: block;width: 100%;}
.scroll-up{opacity: 0; transform: translateY(100px)/*スクロールアップする距離*/; transition: all 2s/*処理にかかる時間*/;}
.scroll-up.done, .scroll-fade.done{opacity : 1; transform : translate(0, 0);}
/*************************************SP****************************************/
@media screen and ( max-width:767px ) {
    /* #Contents-All {
        background-image: url(../img/sp.png);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position-y: -84px;
    } */
	.bredlist.lp {
		line-height: calc(40 *(100vw / 750));
		font-size: calc(20 *(100vw / 750));
		margin: calc(25 *(100vw / 750)) auto;
		width: 92.592%;
		text-align: left;
		padding: 0;
	}
    #Contents-All {margin: 0 auto;}
    #Contents-All .pc-only {display: none;}
    #Contents-All .item-flex-sp {display: flex;flex-wrap: wrap;}
    /*==========================
    共通項目
    ==========================*/
    #Contents-All .size-311 {width: calc(311*(100vw/750));}
    #Contents-All .size-680 {width: calc(680*(100vw/750));}
    #Contents-All .size-700  {width: calc(700*(100vw/750));}
    #Contents-All .under-line {width: calc(642*(100vw/750));}
    #Contents-All .tittle-icon1 {width: calc(130*(100vw/750));}
    #Contents-All .credit {width: calc(300*(100vw/750));}
    #Contents-All .c1-item1, #Contents-All .c1-item3 {margin-left: calc(53*(100vw/750));}
    
    /***********フォント *************/
    #Contents-All .top-txt1 {
        font-size: calc(36*(100vw/750));
        line-height: 1.7;
        letter-spacing: 2px;
        text-align: center;
        margin-top: calc(75*(100vw/750));
    }
    #Contents-All .explain-text {
        font-size: calc(26*(100vw/750));
        line-height: 1.98;
        letter-spacing: 1.36px;
    }
    #Contents-All .c-tittle-txt {
        font-size: calc(36*(100vw/750));
        letter-spacing: 2px;
        padding: calc(19*(100vw/750)) 0 0 calc(31*(100vw/750));
    }
    #Contents-All .c-txt2 {
        font-size: calc(22*(100vw/750));
    }
    #Contents-All .credit a {
        display: inline-block;
        font-size: calc(22*(100vw/750));
        line-height: 2;
        letter-spacing: 0.5px;
        margin-top: calc(12*(100vw/750));
    }
    /*==========================
    top-txt-area
    ==========================*/
    #Contents-All .top-txt-area {
        margin: auto;
    }
    #Contents-All .top-txt-area-img {
        margin-top: calc(32*(100vw/750));
    }
    #Contents-All .top-txt2 {
        margin: calc(70*(100vw/750)) 0 0 calc(36*(100vw/750));
    }
    #Contents-All .first-under-line {
        margin: calc(101*(100vw/750)) auto 0;
    }
    /*==========================
    Contents1
    ==========================*/
    #Contents-All .c1-tittle-main {
        margin: calc(102*(100vw/750)) 0 0 calc(61*(100vw/750));
    }
    #Contents-All .c1-img2 {
        width: 100%;
    }
    #Contents-All .c1-txt1 {
        margin: calc(28*(100vw/750)) 0 0 calc(60*(100vw/750));
    }
    #Contents-All .c1-img1 {
        margin: calc(151*(100vw/750)) auto 0;
    }
    #Contents-All .c1-txt2 {
        margin: calc(19*(100vw/750)) 0 0 calc(480*(100vw/750));
    }
    #Contents-All .c1-item-area {
        margin-top: calc(137*(100vw/750));
    }
    #Contents-All .c1-item3 {
        margin-top: calc(37*(100vw/750));
    }
    #Contents-All .c1-item2 {
        margin-left: calc(22*(100vw/750));
    }
    /*==========================
    Contents2
    ==========================*/
    #Contents-All .c1-img2 {
        margin-top: calc(150*(100vw/750));
    }
    #Contents-All .c2-tittle-main {
        margin: calc(96*(100vw/750)) 0 0 calc(58*(100vw/750));
    }
    #Contents-All .c2-txt1 {
        margin: calc(31*(100vw/750)) 0 0 calc(60*(100vw/750));
    }
    #Contents-All .c2-img1 {
        margin: calc(107*(100vw/750)) auto 0;
    }
    #Contents-All .c2-txt2 {
        margin: calc(18*(100vw/750)) 0 0 calc(245*(100vw/750));
    }
    #Contents-All .c2-item-main-sp {
        margin-top: calc(138*(100vw/750));
    }
    #Contents-All .c2-item-area1 {
        margin-left: calc(54*(100vw/750));
    }
    #Contents-All .c2-item-area2 {
        margin-left: calc(21*(100vw/750));
    }
    #Contents-All .c2-item-img2, .c2-item-img5 {
        margin-top: calc(32*(100vw/750));
    }
    #Contents-All .c2-item-img3, .c2-item-img6 {
        margin-top: calc(35*(100vw/750));
    }
    #Contents-All .second-under-line {
        margin: calc(110*(100vw/750)) auto 0;
    }
    /*==========================
    Contents3
    ==========================*/
    #Contents-All .c3-tittle-icon {
        width: calc(287*(100vw/750));
        margin: calc(116*(100vw/750)) auto 0;
    }
    #Contents-All .c3-item1 {
        margin: calc(54*(100vw/750)) 0 0 calc(220*(100vw/750));
    }
    #Contents-All .c3-credit1 {
        margin-top: calc(6*(100vw/750));
    }
    #Contents-All .c3-item1-txt {
        margin: calc(30*(100vw/750)) calc(-160*(100vw/750));
    }
    #Contents-All .c3-item-img2 {
        margin: calc(48*(100vw/750)) 0 0 calc(219*(100vw/750));
    }
    #Contents-All .c3-credit2 {
        margin-left: calc(222*(100vw/750));
    }
    #Contents-All .c3-item2-txt {
        margin: calc(20*(100vw/750)) calc(57*(100vw/750));
    }
    #Contents-All .c3-item-img3 {
        margin: calc(63*(100vw/750)) 0 0 calc(219*(100vw/750));
    }
    #Contents-All .c3-credit3 {
        margin-left: calc(220*(100vw/750));
		line-height: calc(35*(100vw/750));
		margin-top: calc(20*(100vw/750));
    }
    #Contents-All .c3-credit3 a{
		margin: 0;
        line-height: calc(35*(100vw/750));
    }
    #Contents-All .c3-item34-txt {
        margin: calc(40*(100vw/750)) 0 0 calc(60*(100vw/750));
    }
    /*==========================
    view-all
    ==========================*/
    #Contents-All .viewall-img {
        width: calc(463*(100vw/750));
        margin: calc(143*(100vw/750)) auto 0;
    }
}
/**********************************タブレット*************************************/
@media only screen and (min-width: 561px) and (max-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
    #Contents-All {margin: 0 auto;}
    #Contents-All .item-flex {display: flex;justify-content: center;}
    #Contents-All .item-flex-nomal {display: flex;}
    #Contents-All .item-flex-reverce{flex-direction: row-reverse;}
    #Contents-All .sp-only {display: none;}
	.bredlist.lp {
		margin: 0 auto calc(40*(100vw/1200));
		max-width: 72rem;
		font-size: calc(12*(100vw/1200));
	}
    /*==========================
    ipad size
    ==========================*/
    @media screen and (min-width: 561px) and (max-width: 768px) {
    }
    /*==========================
    共通項目
    ==========================*/
    #Contents-All .img-size220 {width: calc(220*(100vw/1024));}
    #Contents-All .img-size600 {width: calc(600*(100vw/1024));}
    #Contents-All .size-720 {width: calc(720*(100vw/1024));}
    #Contents-All .width-size620 {width: calc(620*(100vw/1024));margin: 0 auto;}
    #Contents-All .width-size720 {width: calc(720*(100vw/1024));margin: 0 auto;}
    #Contents-All .width-size600 {width: calc(600*(100vw/1024));margin: 0 auto;}
    #Contents-All .tittle-icon1 {width: calc(66*(100vw/1024));}
    #Contents-All .c1-item1, #Contents-All .c1-item2,
    #Contents-All .c2-item1, #Contents-All .c2-item2,
    #Contents-All .c2-item4, #Contents-All .c2-item5 {margin-right: calc(30*(100vw/1024));}
    #Contents-All .c3-item-txt {width: calc(285*(100vw/1024));letter-spacing: 1.9px;}
    /***********フォント *************/
    #Contents-All .top-txt1 {
        font-size: 25px;
        line-height: 2;
        letter-spacing: 3px;
        text-align: center;
    }
    #Contents-All .top-txt2 {
        text-align: center;
    }
    #Contents-All .explain-text {
        font-size: calc(14*(100vw/1024));
        line-height: 2.2;
    }
    #Contents-All .c-tittle-txt {
        font-size: 22px;
        letter-spacing: 2.5px;
        padding: 10px 0 0 16px;
    }
    #Contents-All .c-txt2 {
        font-size: 12px;
        letter-spacing: 1.65px;
    }
    #Contents-All .credit a {
        display: inline-block;
        font-size: 12px;
        line-height: 1.7;
        letter-spacing: 1px;
        margin-top: calc(8*(100vw/1024));
    }
    /*==========================
    top-contents
    ==========================*/
    #Contents-All .top-txt-area {
        margin: 0 auto;
    }
    #Contents-All .top-txt2 {
        margin-top: calc(13*(100vw/1024));
        letter-spacing: 2.5px;
    }
    #Contents-All .top-txt-area-img {
        margin-top: calc(52*(100vw/1024));
    }
    /*==========================
    Contents1
    ==========================*/
    #Contents-All .c1-tittle-main {
        margin: calc(87*(100vw/1024)) calc(345*(100vw/1024)) 0 0;
    }
    #Contents-All .c1-txt1 {
        width: calc(640*(100vw/1024));
        margin: calc(27*(100vw/1024)) auto 0;
        letter-spacing: 1.85px;
    }
    #Contents-All .c1-img1 {
        margin: calc(84*(100vw/1024)) auto 0;
    }
    #Contents-All .c1-txt2 {
        margin-top: calc(8*(100vw/1024));
    }
    #Contents-All .c1-item-area {
        margin-top: calc(70*(100vw/1024));
    }
    #Contents-All .c1-img2 {
        margin: calc(135*(100vw/1024)) auto 0;
    }
    /*==========================
    Contents2
    ==========================*/
    #Contents-All .c2-tittle-main {
        margin: calc(87*(100vw/1024)) calc(309*(100vw/1024)) 0 0;
    }
    #Contents-All .c2-txt1 {
        width: calc(655*(100vw/1024));
        margin: calc(28*(100vw/1024)) auto 0;
        letter-spacing: 2.15px;
    }
    #Contents-All .c2-img1 {
        margin: calc(86*(100vw/1024)) auto 0;
    }
    #Contents-All .c2-txt2 {
        margin-top: calc(6*(100vw/1024));
    }
    #Contents-All .c2-item-area1 {
        width: calc(720*(100vw/1024));
        margin: calc(71*(100vw/1024)) auto 0;
    }
    #Contents-All .c2-item-area2 {
        width: calc(720*(100vw/1024));
        margin: calc(38*(100vw/1024)) auto 0;
    }
    /*==========================
    Contents3
    ==========================*/
    #Contents-All .c3-tittle-icon {
        width: calc(140*(100vw/1024));
        margin-top: calc(130*(100vw/1024));
    }
    #Contents-All .c3-item-area1 {
        margin-top: calc(20*(100vw/1024));
    }
    #Contents-All .c3-item2 {
        margin-left: calc(61*(100vw/1024));
    }
    #Contents-All .c3-item1-txt {
        margin: calc(19*(100vw/1024)) 0 0 calc(-60*(100vw/1024));;
    }
    #Contents-All .c3-item2-txt {
        margin: calc(19*(100vw/1024)) 0 0 calc(-1*(100vw/1024));
    }
    #Contents-All .c3-item-area2 {
        margin-top: calc(72*(100vw/1024));
    }
    #Contents-All .c3-item4 {
        margin-left: calc(61*(100vw/1024));
    }
    #Contents-All .c3-item34-txt {
        width: calc(615*(100vw/1024));
        letter-spacing: 1.9px;
        margin: calc(16*(100vw/1024)) auto 0;
    }
    /*==========================
    View-All
    ==========================*/
    #Contents-All .viewall-img {
        width: calc(462*(100vw/1024));
        margin: calc(127*(100vw/1024)) auto 0;
    }
}
/*************************************PC****************************************/
@media screen and ( min-width:1025px ) {
	.bredlist.lp {
		margin: 60px auto 40px;
		width: 720px;
		font-size: 12px;
	}
    /* #Contents-All {
        background-image: url(../img/pc.png);
        background-size: 100%;
        background-position-y: -232px;
    } */
    #Contents-All {margin: 0 auto;}
    #Contents-All .item-flex {display: flex;justify-content: center;}
    #Contents-All .item-flex-nomal {display: flex;}
    #Contents-All .item-flex-reverce{flex-direction: row-reverse;}
    #Contents-All .sp-only {display: none;}
    /*==========================
    共通項目
    ==========================*/
    #Contents-All .img-size220 {width: 220px;}
    #Contents-All .img-size600 {width: 600px;}
    #Contents-All .size-720 {width: 720px;}
    #Contents-All .width-size620 {width: 620px;margin: 0 auto;}
    #Contents-All .width-size720 {width: 720px;margin: 0 auto;}
    #Contents-All .width-size600 {width: 600px;margin: 0 auto;}
    #Contents-All .tittle-icon1 {width: 66px;}
    #Contents-All .c1-item1, #Contents-All .c1-item2,
    #Contents-All .c2-item1, #Contents-All .c2-item2,
    #Contents-All .c2-item4, #Contents-All .c2-item5 {margin-right: 30px;}
    #Contents-All .c3-item-txt {width: 285px;letter-spacing: 1.9px;}
    /***********フォント *************/
    #Contents-All .top-txt1 {
        font-size: 25px;
        line-height: 2;
        letter-spacing: 3px;
        text-align: center;
    }
    #Contents-All .top-txt2 {
        text-align: center;
    }
    #Contents-All .explain-text {
        font-size: 14px;
        line-height: 2.2;
    }
    #Contents-All .c-tittle-txt {
        font-size: 22px;
        letter-spacing: 2.5px;
        padding: 10px 0 0 16px;
    }
    #Contents-All .c-txt2 {
        font-size: 12px;
        letter-spacing: 1.65px;
    }
    #Contents-All .credit a {
        display: inline-block;
        font-size: 12px;
        line-height: 1.7;
        letter-spacing: 1px;
        margin-top: 8px;
    }
    /*==========================
    top-contents
    ==========================*/
    #Contents-All .top-txt-area {
        margin: 0 auto;
    }
    #Contents-All .top-txt2 {
        margin-top: 13px;
        letter-spacing: 2.5px;
    }
    #Contents-All .top-txt-area-img {
        margin-top: 52px;
    }
    /*==========================
    Contents1
    ==========================*/
    #Contents-All .c1-tittle-main {
        margin: 87px 345px 0 0;
    }
    #Contents-All .c1-txt1 {
        width: 640px;
        margin: 27px auto 0;
        letter-spacing: 1.85px;
    }
    #Contents-All .c1-img1 {
        margin: 84px auto 0;
    }
    #Contents-All .c1-txt2 {
        margin-top: 8px;
		text-align: right;
    }
    #Contents-All .c1-item-area {
        margin-top: 70px;
    }
    #Contents-All .c1-img2 {
        margin: 135px auto 0;
    }
    /*==========================
    Contents2
    ==========================*/
    #Contents-All .c2-tittle-main {
        margin: 87px 309px 0 0;
    }
    #Contents-All .c2-txt1 {
        width: 655px;
        margin: 28px auto 0;
        letter-spacing: 2.15px;
    }
    #Contents-All .c2-img1 {
        margin: 86px auto 0;
    }
    #Contents-All .c2-txt2 {
        margin-top: 6px;
		text-align: right;
    }
    #Contents-All .c2-item-area1 {
        width: 720px;
        margin: 71px auto 0;
    }
    #Contents-All .c2-item-area2 {
        width: 720px;
        margin: 38px auto 0;
    }
    /*==========================
    Contents3
    ==========================*/
    #Contents-All .c3-tittle-icon {
        width: 140px;
        margin-top: 130px;
    }
    #Contents-All .c3-item-area1 {
        margin-top: 20px;
    }
    #Contents-All .c3-item2 {
        margin-left: 61px;
    }
    #Contents-All .c3-item1-txt {
        margin: 19px 0 0 -60px;;
    }
    #Contents-All .c3-item2-txt {
        margin: 19px 0 0 -1px;
    }
    #Contents-All .c3-item-area2 {
        margin-top: 72px;
    }
    #Contents-All .c3-item4 {
        margin-left: 61px;
    }
    #Contents-All .c3-item34-txt {
        width: 615px;
        letter-spacing: 1.9px;
        margin: 16px auto 0;
    }
    /*==========================
    View-All
    ==========================*/
    #Contents-All .viewall-img {
        width: 462px;
        margin: 127px auto 0;
    }
}