/*==============================/
/                               /
/　　　　 フルオーダー｜TOP          /   
/                               /
/==============================*/


#full-wrapp {}

.full-title-img {
    background: url("/material/guidunce/variation/images/full_title.jpg") no-repeat;
    width:800px; height:383px;
    position: relative;
}

.full-title-text1{
    position: absolute;
    top:130px; left:36px;
    font-size:21px;
    color:#505050;
    line-height:30px;
    letter-spacing:1px;
    margin:0;
}

.full-title-text2{
    position: absolute;
    top:250px; left:36px;
    font-size:15px;
    color:#505050;
    line-height:30px;
    margin:0; 
}

.full-title {
	color: #565656;
	font-size: 27px;
	font-weight: bold;
	line-height: 40px;
	margin: 10px 0;
	text-align: center;
}

.full-text {
	color: #505050;
	font-size: 15px;
	font-weight: normal;
	line-height: 23px;
	margin: 15px 0;
	padding: 0 35px;
}

.full-cc ul {
	width: 660px;
	float: left;
	padding: 0 70px;
	margin: 10px 0;
}

.full-cc li {
    width: 190px;
    height:210px;
    float: left;
    margin-right: 45px;
    list-style: none;
}

/*=================================================
	マウスオーバー　Q & A
==================================================*/
/*01========================*/
.full-qa01 p {
    width: 190px;
    height: 190px;
    background: url("/material/guidunce/variation/images/full_q01.png") no-repeat;
    display: block;
    text-indent: -9999px;
    margin: 0;
}
.full-qa01 p:hover {
    background-image: url("/material/guidunce/variation/images/full_a01.png");
}
/*02========================*/
.full-qa02 p {
    width: 190px;
    height: 190px;
    background: url("/material/guidunce/variation/images/full_q02.png") no-repeat;
    display: block;
    text-indent: -9999px;
    margin: 0;
}
.full-qa02 p:hover {
    background-image: url("/material/guidunce/variation/images/full_a02.png");
}
/*03========================*/
.full-qa03 p {
    width: 190px;
    height: 190px;
    background: url("/material/guidunce/variation/images/full_q03.png") no-repeat;
    display: block;
    text-indent: -9999px;
    margin: 0;
}
.full-qa03 p:hover {
    background-image: url("/material/guidunce/variation/images/full_a03.png");
}



#btn {margin: 50px 51px 80px; text-align: center;}
#btn2 {margin: 25px 51px 37px; text-align: center;}

#btn a.sample-btn01 {
  float: left;
  position: relative;
  display: inline-block;
  line-height: 100%;
  padding: 19px 90px 19px 75px;
  color: #fff;
  background: #72BEC4;
  text-decoration: none;
  font-size: 19px;
  letter-spacing: 2px;
  margin-right: 32px;
}

#btn a.sample-btn01::before {
  content: url(./images/icon-bag.png);
    position: absolute;
    top: 15%;
    left: 20px;
}

#btn a.sample-btn01::after {
  content: url(../../../../../common/img/r-ancer-on.png);
    position: absolute;
    top: 50%;
    right: 20px;
    margin-top: -9px;
}

#btn a.estimate-btn01 {
  float: left;
  position: relative;
  display: inline-block;
  line-height: 100%;
  padding: 19px 120px 19px 87px;
  color: #fff;
  background: #72BEC4;
  text-decoration: none;
  font-size: 19px;
  letter-spacing: 2px;
}

#btn a.estimate-btn01::before {
  content: url(./images/icon-calculator.png);
    position: absolute;
    top: 15%;
    left: 20px;
}

#btn a.estimate-btn01::after {
  content: url(../../../../../common/img/r-ancer-on.png);
    position: absolute;
    top: 50%;
    right: 20px;
    margin-top: -9px;
}

#btn a.sample-btn01:hover
,#btn a.estimate-btn01:hover
,#btn a.order-eco-btn01:hover
,#btn2 a.order-btn01:hover {
  color: #fff;
  background: #92DBDD;
}
#btn a.order-eco-btn01:hover{
  color: #fff;
  background: #FB9AAE;
}





/*==========================================================
=====| 現在地バーCSS |========================================
==========================================================*/
            .base01 {
                background: #EEEEEE;
                display: inline-block;
                height: 100px;
                position: relative;
                width: 100px;
                text-align: center;
                top: 17px;
            }
            .base01:after {
                border-left: 30px solid #EEEEEE;
                border-top: 50px solid transparent;
                border-bottom: 50px solid transparent;
                content: "";
                height: 0;
                left: 0;
                position: absolute;
                left: 100px;
                width: 0;
                top: 0px;
            }
            .base01:hover {
                background: #96D4D8;
                display: inline-block;
                height: 100px;
                position: relative;
                width: 100px;
                text-align: center;
            }
            .base01:hover:after {
                border-left: 30px solid #96D4D8;
                border-top: 50px solid transparent;
                border-bottom: 50px solid transparent;
                content: "";
                height: 0;
                left: 0;
                position: absolute;
                left: 100px;
                width: 0;
                top: 0px;
            }



            .base02 {
                background: #EEEEEE;
                display: inline-block;
                height: 100px;
                position: relative;
                width: 80px;
                text-align: center;
            }
            .base02:before {
                border-top: 50px solid #EEEEEE;
                border-left: 30px solid transparent;
                border-bottom: 50px solid #EEEEEE;
                border-left: 30px solid transparent;
                content: "";
                height: 0;
                left: 0;
                position: absolute;
                left: -30px;
                width: 0;
            }
            .base02:after {
                border-left: 30px solid #EEEEEE;
                border-top: 50px solid transparent;
                border-bottom: 50px solid transparent;
                content: "";
                height: 0;
                left: 0;
                position: absolute;
                left: 80px;
                top:0;
                width: 0;
            }
            .base02:hover {
                color: #FFFFFF; 
                background: #96D4D8;
                display: inline-block;
                height: 100px;
                position: relative;
                width: 80px;
                text-align: center;
            }
            .base02:hover:after {
                color: #FFFFFF;
                border-left: 30px solid #96D4D8;
                border-top: 50px solid transparent;
                border-bottom: 50px solid transparent;
                content: "";
                height: 0;
                left: 0;
                position: absolute;
                left: 80px;
                top:0;
                width: 0;
            }
            .base02:hover:before {
                color: #FFFFFF;
                border-top: 50px solid #96D4D8;
                border-left: 30px solid transparent;
                border-bottom: 50px solid #96D4D8;
                border-left: 30px solid transparent;
                content: "";
                height: 0;
                left: 0;
                position: absolute;
                left: -30px;
                width: 0;
            }           


            .myPlace {text-align: center;margin:50px 0;}
            
            .myPlace a {
                font-size: 14px;
                color: #787878!important;
                padding: 15px 0;
                display: block;
                text-decoration: none;
                font-weight: bold;
                height: 70px;
                line-height: 17px;
            }
            .myPlace a:hover {
                color: #FFFFFF!important;
            }


            .ml30 {margin-left: 30px;}


            .btnImg01 {background-image:url(/material/guidunce/variation/images/picon/about_icon.png);}
            .btnImg01:hover {background-image:url(/material/guidunce/variation/images/picon/about_icon_on.png);}
            .btnImg02 {background-image:url(/material/guidunce/variation/images/picon/size_icon.png);}
            .btnImg02:hover {background-image:url(/material/guidunce/variation/images/picon/size_icon_on.png);}
            .btnImg03 {background-image:url(/material/guidunce/variation/images/picon/paper_icon.png);}
            .btnImg03:hover {background-image:url(/material/guidunce/variation/images/picon/paper_icon_on.png);}
            .btnImg04 {background-image:url(/material/guidunce/variation/images/picon/handle_icon.png);}
            .btnImg04:hover {background-image:url(/material/guidunce/variation/images/picon/handle_icon_on.png);}
            .btnImg05 {background-image:url(/material/guidunce/variation/images/picon/design_icon.png);}
            .btnImg05:hover {background-image:url(/material/guidunce/variation/images/picon/design_icon_on.png);}
            .btnImg06 {background-image:url(/material/guidunce/variation/images/picon/option_icon.png);}
            .btnImg06:hover {background-image:url(/material/guidunce/variation/images/picon/option_icon_on.png);}   



/* 現在地の場合 ==============================================*/
            .base03 {
                background: #96D4D8;
                display: inline-block;
                height: 100px;
                position: relative;
                width: 100px;
                text-align: center;
                top: 17px;
            }
            .base03:after {
                border-left: 30px solid #96D4D8;
                border-top: 50px solid transparent;
                border-bottom: 50px solid transparent;
                content: "";
                height: 0;
                left: 0;
                position: absolute;
                left: 100px;
                width: 0;
                top: 0px;
            }



            .base04 {
                background: #96D4D8;
                display: inline-block;
                height: 100px;
                position: relative;
                width: 80px;
                text-align: center;
            }
            .base04:before {
                border-top: 50px solid #96D4D8;
                border-left: 30px solid transparent;
                border-bottom: 50px solid #96D4D8;
                border-left: 30px solid transparent;
                content: "";
                height: 0;
                left: 0;
                position: absolute;
                left: -30px;
                width: 0;
            }
            .base04:after {
                border-left: 30px solid #96D4D8;
                border-top: 50px solid transparent;
                border-bottom: 50px solid transparent;
                content: "";
                height: 0;
                left: 0;
                position: absolute;
                left: 80px;
                top:0;
                width: 0;
            }


            .now a {
                font-size: 14px;
                color: #FFFFFF!important;
                padding: 15px 0;
                display: block;
                text-decoration: none;
                font-weight: bold;
                height: 70px;
                line-height: 17px;
            }


            .btnImg01-now {background-image:url(/material/guidunce/variation/images/picon/about_icon_on.png);}
            .btnImg02-now {background-image:url(/material/guidunce/variation/images/picon/size_icon_on.png);}
            .btnImg03-now {background-image:url(/material/guidunce/variation/images/picon/paper_icon_on.png);}
            .btnImg04-now {background-image:url(/material/guidunce/variation/images/picon/handle_icon_on.png);}
            .btnImg05-now {background-image:url(/material/guidunce/variation/images/picon/design_icon_on.png);}
            .btnImg06-now {background-image:url(/material/guidunce/variation/images/picon/option_icon_on.png);}


/*============================================== 現在地の場合 */