.wrapper{background-size: 100% auto;}
.for_pc{ display: none; }
.for_m{ display: block; }


.main{height: 758px; }
.main .description1{display: none;}
.main .description2{display: none;}
.main .description3{display: none;}
@media screen and (max-width: 800px){
	.main{background:url(../images/mainBGS.png) center top no-repeat; background-size: 100% auto; height: 0; padding-bottom: 76%;}
	.main .titleAnimate{display: none;}
}/*media*/


#work .topic{height:0; padding-bottom:31%; margin:-14% 0 0 0;}
#work .topic a{width:33%; max-width: 324px;}
#work .topic a.work01{margin: 0 0 0 -48%;}
#work .topic a.work02{margin: 0 0 0 -15%;}
#work .topic a.work03{margin: 0 0 0 18%;}
@media screen and (max-width: 800px){
	#work .topic{ margin:-3% 0 0 0;}
	#work .topic a{width:36%; max-width:inherit;}
	#work .topic a.work01{margin: 0 0 0 -50%;}
	#work .topic a.work02{margin: 0 0 0 -17%;}
	#work .topic a.work03{margin: 0 0 0 15%;}
}/*media*/


#work .topic-body {width: 100%;left: 0%;margin: 0;}
#work .topic-body .tour {padding: 0 0 13% 0;}
#work .tour .dotHorizontal {width: calc(98% - 535px); border-bottom: dotted 3px #ff006a; left: inherit; margin: 35px 2% 0 0; right: 0;}
#work .tour .dotHorizontal2 {width: 98%; border-bottom: dotted 3px #ff006a; left: inherit; margin: 35px 2% 0 0; right: 0;}
#work .tour .dotVertical{display: none;}
#work .tour .descript {width: 75%;background: none;text-align: left; padding: 3%;}
#work .tour .descript h3{margin: 6px 0 0 0;}
#work .tour .descript img {width: 30%; margin: 0% 0 0 50%;}
#work .tour .descript img.cute3 {width: 36%; margin: -2% 0 0 42%;}
@media screen and (max-width: 925px){
    #work .tour .descript p:last-child{width: 135%;}
}
@media screen and (max-width: 768px){
    #work .tour .dotHorizontal{width: 98%; margin: 4% 2% 0 0;}
    #work .tour .dotHorizontal2{width: 98%; margin: 5% 2% 0 0;}
    #work .tour h2 { font-size: 24px; line-height: 50px; height: 50px; padding: 0 12px 0 24px; }
    #work .tour h2:before {width: 12px;}
    #work .tour h2:after { margin: 0 -15px 0 0; border-width: 25px 0 25px 15px;}
    #work .tour .descript {width: 100%;}
    #work .tour .descript img {display: none;}
    #work .tour .descript h3 { font-size: 16px;margin:0;letter-spacing: 0.02em; }
    #work .tour .descript p {font-size: 14px; line-height:1.2; color: #000; margin: 10px 0 0 0; }
    #work .tour .descript p:last-child{width:100%;}
}/*media*/
@media screen and (max-width: 450px){
    #work .tour h2 { font-size: 5vw; line-height: 10vw; height: 10vw; }
    #work .tour h2:after { margin: 0 -12px 0 0; border-width: 5vw 0 5vw 12px; }
}/*media*/


/*turn*/
#work .tour.turn .descript {margin: 0 0 0 24%;}
#work .tour.turn .descript img.cute2{width: 25%; margin: 0 0 0 -26%;}
#work .tour.turn .descript img.cute4{width: 25%; margin: 0 0 0 -26%;}
#work .tour.turn .dotHorizontal {width: calc(98% - 535px); border-bottom: dotted 3px #15baff; left:0; margin: 35px 0 0 2%; right:inherit;}
#work .tour.turn .dotHorizontal2 {width:98%; border-bottom: dotted 3px #15baff; left:0; margin: 35px 0 0 2%; right:inherit;}
@media screen and (max-width: 925px){
    #work .tour.turn .descript p:last-child{margin: 27px 0 0 -34%;}
}/*media*/
@media screen and (max-width: 768px){
    #work .tour.turn h2:after {left: 0; margin: 0 0 0 -15px; border-width: 25px 15px 25px 0;}
    #work .tour.turn .dotHorizontal{width: 98%; margin: 5% 0 0 2%;}
    #work .tour.turn .dotHorizontal2{width: 98%; margin: 5% 0 0 2%;}
    #work .tour.turn .descript {width: 100%; margin: 0;}
    #work .tour.turn .descript p:last-child{width:100%; margin: 10px 0 0 0;}
}/*media*/
@media screen and (max-width: 450px){
    #work .tour.turn h2 { font-size: 5vw; line-height: 10vw; height: 10vw; }
    #work .tour.turn h2:after {margin: 0 0 0 -12px; border-width: 5vw 12px 5vw 0; }
}/*media*/