#contents.product .section_top .back_container{background-image: url(../images/join/top_bg.jpg)}
#contents.product .section{padding: 130px 0;text-align: center}
#contents.product .section .inner{max-width: 1080px;margin: 0 auto;}
#contents.product .section .inner h3{font-size: 32px;line-height: 36px;text-align: center;}
#contents.product .section .inner h4{position: relative;margin: 95px 0 15px; font-size: 30px;line-height: 33px;text-align: center;color: #666666;padding-top: 18px;}
#contents.product .section .inner h4:before{content: '';position: absolute;top:0;left:50%;width: 40px;height: 3px;margin-left: -20px;background: url(../images/common/h4_line.png) no-repeat center top;}
#contents.product .section .inner p{font-size: 20px;line-height: 34px;color: #666666;text-align: center;padding-top: 20px;}

#contents.product .section.standard .inner{}
#contents.product .section.standard .inner ul{margin: 75px auto 0;overflow: hidden}
#contents.product .section.standard .inner ul li{float: left;text-align: left;padding-left: 20px;white-space: nowrap;width:calc((100% - 80px) / 5)}
#contents.product .section.standard .inner ul li:first-child,#contents.product .section.standard .inner ul li:nth-child(6){padding-left: 0;}
#contents.product .section.standard .inner ul li .tit{font-size: 24px;line-height: 30px;color: #62b134;letter-spacing: -0.5px;padding: 10px 0 25px;}
#contents.product .section.standard .inner ul li dl dd{position: relative;  padding: 5px 0 5px 10px;font-size: 14px;line-height: 23px;color: #666666;}
#contents.product .section.standard .inner ul li dl dd:before{content: '';position: absolute;top:13px;left:0;width: 4px;height: 4px;background: #62b134;border-radius: 100%;}

#contents.product .section.csv{background: #f6f6f6;}
#contents.product .section.csv .inner{max-width: 1090px}
#contents.product .section.csv .inner ul{margin: 0 auto 0;}
#contents.product .section.csv .inner ul li{overflow:hidden;padding: 60px 0 0;}
#contents.product .section.csv .inner ul li .img{float: left;white-space: nowrap;width:675px;}
#contents.product .section.csv .inner ul li .text{float: left;text-align: left;width:calc((100% - 675px) - 55px);margin-left:55px;}
#contents.product .section.csv .inner ul li .text .desc{font-size: 18px;line-height: 30px;color: #666666;letter-spacing: -0.5px;padding-bottom: 15px;padding-left: 0;}
#contents.product .section.csv .inner ul li .text .desc:before{content: none;}
#contents.product .section.csv .inner ul li .text .tit{font-size: 24px;line-height: 30px;color: #62b134;letter-spacing: -0.5px;padding: 0 0 15px;}
#contents.product .section.csv .inner ul li dl{}
#contents.product .section.csv .inner ul li dl dd{position: relative;padding: 5px 0 5px 10px; font-size: 14px;line-height: 23px;color: #666666;}
#contents.product .section.csv .inner ul li dl dd:before{content: '';position: absolute;top:16px;left:0;width: 4px;height: 4px;background: #62b134;border-radius: 100%;}
#contents.product .section.csv .inner .condition .desc{font-size: 18px;line-height: 20px;color: #6f6f6f;letter-spacing: -0.5px;padding:15px 0 55px;}
#contents.product .section.csv .inner .condition .list_area{overflow: hidden;width: 100%;margin: 60px auto 0}
#contents.product .section.csv .inner .condition ul{width:100%}
#contents.product .section.csv .inner .condition ul li{position: relative; margin-left: 20px; width:calc((100% - 60px) / 4);height: 130px;float: left;background: #fff; letter-spacing:-0.6px;font-size: 13px;line-height: 20px;color: #666; box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;text-align: center;padding:10px;overflow: inherit;}
#contents.product .section.csv .inner .condition ul li:first-child{margin-left: 0;}
#contents.product .section.csv .inner .condition ul li:before{content: '';position: absolute;left:-20px;top:50%;width: 20px;height: 1px;background:#dad9d8; }
#contents.product .section.csv .inner .condition ul li:after{content: '';position: absolute;left:0;right:0;bottom:0;height: 2px;background:#87a2be }
#contents.product .section.csv .inner .condition ul li:first-child:before{content: none;}
#contents.product .section.csv .inner .condition ul li em{display: block;font-size: 16px;color: #333;padding-top: 20px;padding-bottom: 20px;letter-spacing: 0;}
#contents.product .section.csv .inner .condition ul li.line3 em{padding-bottom: 10px;}
#contents.product .section.csv .inner .condition ul li:nth-child(1):after{background:#87a2be }
#contents.product .section.csv .inner .condition ul li:nth-child(2):after{background:#88bb8a }
#contents.product .section.csv .inner .condition ul li:nth-child(3):after{background:#5faf96 }
#contents.product .section.csv .inner .condition ul li:nth-child(4):after{background:#71b0b6 }

#contents.product .section.qtest{padding:130px 0 0}
#contents.product .section.qtest .inner ul{height: 160px;margin-top: 80px;width: 100%;display: inline-block;}
#contents.product .section.qtest .inner ul li{width: 200px; height: 160px;float: left;position: relative;text-align: center;color: rgb(117, 117, 117);border-width: 1px;border-style: dashed;border-color: silver;border-image: initial;background: rgb(255, 255, 255);border-radius: 4px;}
#contents.product .section.qtest .inner ul li span{display: block;font-size: 24px;color: rgb(56, 56, 56);padding: 55px 0px 10px;}
#contents.product .section.qtest .inner ul li em{position: absolute;top: -20px;left: 50%;margin-left: -26px;}
#contents.product .section.qtest .inner ul .arrow{width:83px;float: left;height: 160px; background: url(../images/join/arrow.png) 50% center / 18px 27px no-repeat;}
#contents.product .section.qtest .inner .remarks{margin-top: 40px;color: #383838;text-align:left;display: inline-block;width:100%}
#contents.product .section.qtest .inner .remarks .text{float: left;line-height: 2;}
#contents.product .section.qtest .inner .remarks .text p{text-align:left;padding-left: 17px;padding-top: 0px;color: rgb(117, 117, 117);font-size: 14px;}
#contents.product .section.qtest .inner .remarks span{display: block;font-size: 20px;padding-bottom: 6px;}
#contents.product .section.qtest .inner .remarks .mc-code{float: right;padding-top: 30px;text-align:center}

@media all and (max-width:1024px){
    #contents.product .section{padding: 100px 0;}
    #contents.product .section .inner{max-width: 100%;width: calc(100% - 40px)}
    #contents.product .section.csv .inner ul li .img{width: calc((100% - 30px) / 2)}
    #contents.product .section.csv .inner ul li .text{width: calc((100% - 30px) / 2);margin-left: 30px}
    #contents.product .section.qtest .inner ul li{width: calc((100% - 158px) / 4)}
    #contents.product .section.qtest .inner ul .arrow{width: 50px}
}
@media all and (max-width:812px){
    #contents.product .section.standard .inner ul li .tit{font-size: 18px;}
    #contents.product .section.csv .inner ul li{padding: 30px 0 0;}
    #contents.product .section.csv .inner ul li .img{width: 100%}
    #contents.product .section.csv .inner ul li .img img{width: 100%}
    #contents.product .section.csv .inner ul li .text{width: 100%;margin: 20px 0 0;}
    #contents.product .section.csv .inner ul li .text .tit{font-size: 20px;}
    #contents.product .section.csv .inner h4{margin: 50px 0 15px;font-size: 24px;}
    #contents.product .section.qtest{padding: 100px 0 50px;}
    #contents.product .section.qtest .inner ul li{font-size: 14px;}
    #contents.product .section.qtest .inner ul li span{font-size: 20px;}
    #contents.product .section.qtest .inner .remarks{margin-top: 20px;}
    #contents.product .section.qtest .inner .remarks .text{width: 100%;font-size: 14px}
    #contents.product .section.qtest .inner .remarks .mc-code{float: left;padding-top: 10px;}
}
@media all and (max-width:480px){
    #contents.product .section{padding: 50px 0;}
    #contents.product .section .inner h3{font-size: 24px}
    #contents.product .section .inner p{font-size: 16px}
    #contents.product .section.standard .inner ul li{width: calc((100% - 20px) / 2);padding-left:0}
    #contents.product .section.standard .inner ul li:nth-child(even){padding-left:20px}
    #contents.product .section.csv .inner .condition ul li{width: calc((100% - 20px) / 2);margin-bottom: 20px;}
    #contents.product .section.csv .inner .condition ul li.line3{margin-left: 0px;}
    #contents.product .section.csv .inner .condition ul li.line3:before{height:0}
    #contents.product .section.csv .inner .condition ul li:last-child{margin-left: 20px;}
    #contents.product .section.csv .inner .condition ul li:last-child:before{height: 1px;}
    #contents.product .section.qtest{padding: 50px 0}
    #contents.product .section.qtest .inner ul{height: auto}
    #contents.product .section.qtest .inner ul li{width: 100%;height: auto;padding-bottom: 30px;float: none}
    #contents.product .section.qtest .inner ul li span{font-size: 18px;}
    #contents.product .section.qtest .inner ul .arrow{float: none;height: 60px;margin: 0 auto 15px;transform:rotate(90deg);}
}