@charset "utf-8";

/**************************************************

		point
        
**************************************************/

#contents div{display:table;}
#contents h2 {font-size: 26px;padding-top: 17px; height: 82px;}
#contents h3{background:#0e8340;color:#fff;width: 100%;text-align: center;margin: 0 auto;font-size: 22px;line-height: 45px;}
#contents .preface{margin:20px 0;background:url(../images/hand.png) 100% 88% no-repeat;}
#contents .preface .balloon{ display: inline-block; position: relative;padding: 20px;max-width: 360px;border-radius: 5px;background: #fff; border: 1px solid #888888;font-size:11px;margin:0;}
#contents .preface .balloon:before { content: "";position: absolute;bottom: 2px;right: -10px;border: 15px solid transparent;border-right: 14px solid #fff;-ms-transform: rotate(-35deg);-webkit-transform: rotate(-35deg);transform: rotate(-45deg);z-index: 2;}
#contents .preface .balloon:after {content: "";position: absolute;bottom: 3px;right: -13px;border: 13px solid transparent;border-right: 13px solid #888888;-ms-transform: rotate(-35deg);-webkit-transform: rotate(-35deg);transform: rotate(-45deg);z-index: 1;}
#contents .preface .balloon span{font-size:18px;font-family:"Century Gothic", sans-serif;}
#contents .desc .section .box li dl{position:relative;background: #fff;margin: 10px 3px;text-align: center;padding: 10px;height:200px;}
#contents .desc .section .box li dl dt{font-size: 120%;font-weight:600;color:#0e8340;line-height:2em;margin: 0 auto;}
#contents .desc .section .box li dl dd{margin:0;font-size: 11px;line-height: 1.6em;padding: 0 21px;}
#contents .desc .section .box li dl dd img{position:absolute;left: 0;right: 0;margin: 0 auto;bottom: 65px;}
#contents .desc .section .box li a{display:block;}
#contents .desc .section .box li dl dd:last-child{color:#fff;}


/*サイズについて*/
#contents #size .section .box ol li p{margin: 0px 10px 0 13px;background:#555;text-decoration:none;color:#fff;position: relative;width: 93%;text-align: center;font-size: 24px;font-weight: 600;box-shadow: 0px 2px 10px #aaa;line-height: 151%;}
#contents #size .section .box ol li p:last-child{margin-right:15px;}
#contents #size .section .box ol li p:before{content: "";position: absolute;top: 0%;margin-top: 0px;border-width: 18px 0px 18px 13px;border-style: solid;border-color: #555 #555 #555 transparent;left: -13px;}
#contents #size .section .box ol li p:after{content: "";position: absolute;top: 0px;margin-top: 0px;border-top: 18px solid transparent;border-bottom: 18px solid transparent;border-left: 13px solid #555;right: -13px;}
#contents #size .section .box ol li dl{border-radius: 10px;}
#contents #size .section .box ol li dl dd img{bottom: 10px;}

/*タイプ選びについて*/
#contents #type .preface .balloon{margin-top:10px;}
#contents #type .section .box ul li dl:before {content: "";top: 0;left: 0;border-bottom: 4em solid transparent;position: absolute;z-index: 100;}
#contents #type .section .box ul li.light dl:before {border-left: 4em solid #f5c153;}
#contents #type .section .box ul li.stability dl:before {border-left: 4em solid #78d1aa;}
#contents #type .section .box ul li.balance dl:before {border-left: 4em solid #d178b3;}
#contents #type .section .box ul li dl{border: #0e8340 1px solid;position: relative;height:220px;}
#contents #type .section .box ul li dl dt{font-size:22px;}
#contents #type .section .box ul li dl dd:last-child{background:#0e8340;border-radius: 20px;bottom: 20px;position: absolute;left: 40px;right: 40px;line-height:2.5em;}
#contents #type .section .box ul li dl dd:last-child:before{content:"";top: 7px;right: 12px;border-bottom: 6px solid transparent;border-left: 5px solid #FFF;position: absolute;border-top: 6px solid transparent;}
	
/*オススメモデルについて*/
#contents #recommend .section .box ul li dl{border:2px solid #0e83404a;height:230px;}
#contents #recommend .section .box ul li dl dt{font-size: 165%;font-weight:normal;border-bottom:8px solid #0e83404a;width: 70%;margin-bottom: 10px;line-height: 1.4em;}
#contents #recommend .section .box ul li:last-child dl dt{font-size:28px;width: 96%;}
#contents #recommend .section .box ul li dl dt span{font-weight:bold;font-size: 35px;padding-left: 3px;}
#contents #recommend .section .box ul li dl dd:last-child{bottom: 0px;position: absolute;left: 0px;right: 0px;line-height: 1.5em;text-align: left;padding: 5px 30px;font-size:100%;}
#contents #recommend .section .box ul li.light dl dd:last-child{background: #f5c153;}
#contents #recommend .section .box ul li.stability dl dd:last-child{background: #78d1aa;}
#contents #recommend .section .box ul li.balance dl dd:last-child{background: #d178b3;}
#contents #recommend .section .box ul li dl dd span{display:block;font-size:110%;font-weight: 600;	}
#contents .cond{display:block;width:100%;margin:30px auto 0;background:url(../images/from_here_bg.png) 40% no-repeat;height: 86px;background-size: 110%;}
#contents .cond p {display: none;}
#contents .cond ul{width:71%;margin: 0 0 0 auto;padding-top: 15px;}
#contents .cond ul li{display:inline-block;padding: 0px 3px;width:30%;}
#contents .cond ul li.btn1 a{background:url(../images/btn_01-hover.png) 50% 0% no-repeat;background-size: 100%;}
#contents .cond ul li.btn2 a{background:url(../images/btn_02-hover.png) 50% 0% no-repeat;background-size: 100%;}
#contents .cond ul li.btn3 a{background:url(../images/btn_03-hover.png) 50% 0% no-repeat;background-size: 100%;}
#contents .cond ul li a{display:inline-block;}
#contents .cond ul li a img{width:100%;}
#contents .cond ul li a:hover {background-color: transparent; /* IE6対応 */}
#contents .cond ul li a:hover img {visibility: hidden;}


@media screen and (max-width: 800px){
#contents .desc{width:100%;}
#contents .preface .balloon {max-width: 278px;}
#contents #recommend .section .box ul li:last-child dl dt {font-size: 22px;}
}

@media screen and (max-width: 480px){
#contents h2 {font-size: 12px;padding-top: 8px;height: 35px;}
#contents h3 {font-size: 11px;line-height: 20px;}
#contents .preface { background-position:100% 100%;}
#contents .preface .img { width: 100%;text-align: center; display: block; padding: 0;}
#contents .preface .text { font-size:12px;}
#contents .preface .balloon { width: 70%;}
#contents .cond { width: 100%;background-image:none; background-color:#e3e2db;; height: auto;}
#contents .cond p {     display: block; width: 100%;text-align: center;font-weight: bold; font-size: 20px; text-shadow: 2px 2px 0px #fff;
 border-bottom: 1px solid #f1f0ea; padding: 10px 0; color: #555; margin:0;}
#contents .cond ul { width: 100%; margin: 0 auto;  text-align: center;}
}