@charset "utf-8";

.top10 {
	padding-top:10px;
}

.top20 {
	margin-top:20px;
}

.top30 {
	margin-top:30px;
}

.top40 {
	margin-top:40px;
}

.top50 {
	margin-top:50px;
}

.bottom0 {
	margin-bottom:0!important;
}

.bottom10 {
	margin-bottom:10px;
}

.bottom20 {
	margin-bottom:20px;
}

.bottom30 {
	margin-bottom:30px;
}

.bottom40 {
	margin-bottom:40px;
}

.bottom50 {
	margin-bottom:50px;
}

.left{
    float: left;
    display: inline;
}

.right{
    float: right;
    display: inline;
}

.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

.switch {
	visibility:hidden;
}

.sp {
	display:none!important;
	height:0!important;
	overflow:hidden!important;
}

body {
	color:#333333;
	font-family:Shin Maru Go Light;
	line-height:1.75;
	font-size: 17px;
	min-width: 1080px;
}

a {
	color:#ffffff;
	text-decoration:none;
}
a:hover{
opacity:0.8;
filter: alpha(opacity=80);        /* ie lt 8 */
-ms-filter: "alpha(opacity=80)";  /* ie 8 */
-moz-opacity:0.8;                 /* FF lt 1.5, Netscape */
-khtml-opacity: 0.8;              /* Safari 1.x */
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -webkit-backface-visibility: hidden;

    backface-visibility: hidden;
}

img {
	vertical-align:top;
}


#top header{
    width: 100%;
    height: 100px;
	background-color: #019ddd;
}
header .inner{
    width: 1080px;
    margin: 0 auto;
	font-size: 12px;
	text-align: left;
	background-color: #019ddd;
    color: #fff;
    overflow: hidden;
}

header div h1{
    float: left;
    padding: 25px;
}
header div p{
    float: right;
    font-size: 32px;
    line-height: 1;
	letter-spacing: 0.1em;
    padding: 35px 25px 0 0;
}

.phone{
    font-family:Shin Go Regular;
    font-size: 1.2em;
}

#mainVisual{
    background-image: url(../img/mainvisualbg_pc.png);
    background-position: center top;
    background-repeat: repeat-x;
    background-size:auto 800px;
    height: 800px;
    position: relative;
    overflow: hidden;
}



#maintitle{
    width: 1080px;
    overflow: hidden;
    color: white;
	text-shadow: 2px 2px 2px #000;
    padding-top: 175px;
    margin: 0 auto;
    opacity: 0;
    background: url(../img/shadowtop.png) no-repeat center top;

}

.load #maintitle{
    opacity: 1;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transition-delay: 1s;
}


#slider1{
    float: left;
    width: 535px;
    background: url(../img/mac_pc.png) no-repeat 0 0;
    height: 292px;
}

#slider1 li{
    width: 374px;
    height: 234px;
    left: 81px;
    top: 16px;
}



#maintitle h1{
    font-size: 45px;
    font-weight: normal;
    line-height: 59px;
    padding-top: 60px;
	text-shadow: 2px 2px 2px #000;
}

#mainVisual dl{
    text-align: center;
    color: white;
    padding-top: 90px;
    font-size: 1.1em;
    line-height: 1.5;
    opacity: 0;
	text-shadow: 2px 2px 2px #000;
}

#mainVisual.load dl{
    opacity: 1;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transition-delay: 1.7s;
}


#mainVisual dl dd:nth-child(2){
    padding: 1em 0 .5em;
}

#mainVisual dl dd a{
    color: white;
    font-size: 31px;
    padding-left: .5em;
	letter-spacing: 0.1em;
}
#mainVisual hr{
    border: none;
    border-bottom: rgba(255,255,255,0.5) solid 1px;
    position: absolute;
    width: 100%;
    bottom: 220px;
}
article #point5 section{
    position: relative;
}
article #point5 section:nth-child(2n-1){
	width:100%;
	height: 450px;
	overflow: hidden;
	background-color: #63cbd4;
}

article #point5 section#p03:nth-child(2n-1){
	width:100%;
	height: 450px;
	overflow: hidden;
	background-color: #ab75c7;
}

article #point5 section#p05:nth-child(2n-1){
	width:100%;
	height: 450px;
	overflow: hidden;
	background-color: #3870cf

}
 
article #point5 section:nth-child(2n){
	width:100%;
	height: 450px;
	overflow: hidden;
	background-color: #eeeeee;
}


article #point5 section .frame {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 450px;

}

article #point5 section:nth-child(2n) .frame {

}


article #point5 section .inner{
    width: 1080px;
    height: 450px;
    overflow: hidden;
    margin: 0 auto;
    position: relative;
}

article #point5 section dl{
    float: right;
    color: white;
    width: 570px;
    padding: 45px 80px 0 0;
}

article #point5 section:nth-child(2n) dl{
    color: #333333;
}





article #point5 section dl dt{
    font-size: 34px;
    line-height: 1.2;
    padding: 20px 0 10px;
}

article #point5 section dl dd{
    line-height: 30px;
}



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

css

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

article #point5 section#p01 .img{
    position: absolute;
	top: 0px;
    left: -800px;
    opacity: 0;
    background: url(../img/01img_pc.png) no-repeat 0 0;
    width: 576px;
    height: 400px;
}


article #point5 section#p01.animation .img{
    opacity: 1;
    left: -100px;

    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}



article #point5 section#p02 .img{
    position: absolute;
    bottom: 0px;
    left: -800px;
    opacity: 0;
    background: url(../img/02img_pc.png) no-repeat 0 0;
    width: 576px;
    height: 400px;
}

article #point5 section#p02.animation .img{
    opacity: 1;
    left: -100px;

    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}




article #point5 section#p03 .img{
    position: absolute;
    bottom: 0px;
    left: -800px;
    background: url(../img/03img_pc.png) no-repeat 0 0;
    width: 576px;
    height: 400px;
}


article #point5 section#p03.animation .img{
    opacity: 1;
    left: -100px;

    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}




article #point5 section#p04 .img{
    position: absolute;
    bottom: 0px;
    left: -800px;
    background: url(../img/04img_pc.png) no-repeat 0 0;
    width: 576px;
    height: 400px;
}

article #point5 section#p04.animation .img{
    opacity: 1;
    left: -100px;

    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}


article #point5 section#p05 .img{
    position: absolute;
    bottom: 0px;
    left: -800px;
    background: url(../img/05img_pc.png) no-repeat 0 0;
    width: 576px;
    height: 400px;
}

article #point5 section#p05.animation .img{
    opacity: 1;
    left: -100px;

    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}


article #point5 section#p06 .img{
    position: absolute;
    bottom: 0px;
    left: -800px;
    background: url(../img/06img_pc.png) no-repeat 0 0;
    width: 576px;
    height: 400px;
}

article #point5 section#p06.animation .img{
    opacity: 1;
    left: -100px;

    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}







#plan3{

}


#plan3 h2{
    text-align: center;
    padding: .7em 0;
    font-size: 38px;
    color: #333333;
    line-height: 1;
    font-weight: normal;
}







#plan4{
}


#plan4 h2{
    text-align: center;
    padding: .8em 0;
    font-size: 50px;
    color: #333333;
    line-height: 1;
    font-weight: normal;
}

#plan4 .inner{
    width: 990px;
    overflow: hidden;
    margin: 0 auto;
}
#plan4 .inner > ul{
    width: 990px;
    overflow: hidden;
}
#plan4 .inner > ul >li{
    float: left;
    width: 330px;
    min-height: 800px;
    text-align: center;
    position: relative;
    overflow: hidden;
}
#plan4 .inner > ul >li:nth-child(4){
    background-image: none;
}


#plan4 .inner li > div{
    position: relative;
    width: 100%;
    height: 360px;
	margin-top: 20px;
    margin-bottom: 20px;
    overflow: hidden;
}

#plan4 .inner li > div img{
    position: absolute;
    left: 0;
    bottom: 0;
}
#plan4 .inner li:nth-child(1) div img{left: 15px;}
#plan4 .inner li:nth-child(2) div img{left: 15px;}
#plan4 .inner li:nth-child(3) div img{left: 15px;}


#plan4 .inner li dl dt{
font-size: 24px;
line-height: 1.2;
padding-bottom: .5em;
}
#plan4 .inner li dl dt span{
    display: block;
    font-size: 18px;
}

#plan4 .inner li dl dd p{
    padding: 0 .5em;
    text-align: left;
    line-height: 1.8;
    min-height: 18em;
}
#plan4 .inner li dl dd ul{
    padding-top: 1em;
}
#plan4 .inner li dl dd ul li {
	width: 210px;
	height: 30px;
    border: dotted 1px;
	border-radius: 3px; /* border radius */
	background-color: #fff; /* layer fill content */
	margin: 0 auto .5em;
}

#plan4 .inner li dl dd:last-child{
    position: absolute;
    bottom: 10px;
    left: 10px;
}

#plan4 .inner li dl dd a {
    display:inline-block;
	width: 310px;
	height: 50px;
	border-radius: 6px; /* border radius */
	color: white;
	line-height: 3;
}
#plan4 .inner li dl dd a i{
    padding-right: .5em;
}

/****************************************************
EASY PLAN
****************************************************/
#plan4 .inner > ul > li:nth-child(1){
    background-color: #dfd399;
}

#plan4 .inner li:nth-child(1) strong{
    background: #000;
}
#plan4 .inner li:nth-child(1) dt,
#plan4 .inner li:nth-child(1) ul li{
    color: #000;
}

#plan4 .inner li:nth-child(1) ul li{
    border-color: #000;
}

#plan4 .inner li:nth-child(1) dl dd a {
	-moz-box-shadow: 0 1px 0 rgba(80,55,0,.73); /* drop shadow */
	-webkit-box-shadow: 0 1px 0 rgba(80,55,0,.73); /* drop shadow */
	box-shadow: 0 1px 0 rgba(80,55,0,.73); /* drop shadow */
	background-image: -moz-linear-gradient(bottom, #c0a047 0%, #c0a047 50.29%, #c0a047 50.29%, #c0a047 100%); /* gradient overlay */
	background-image: -o-linear-gradient(bottom, #cda95b 0%, #cda95b 50.29%, #d7b97d 50.29%, #d7b97d 100%); /* gradient overlay */
	background-image: -webkit-linear-gradient(bottom, #cda95b 0%, #cda95b 50.29%, #d7b97d 50.29%, #d7b97d 100%); /* gradient overlay */
	background-image: linear-gradient(bottom, #cda95b 0%, #cda95b 50.29%, #d7b97d 50.29%, #d7b97d 100%); /* gradient overlay */
}

#Easyplan{
    background-color: #e1d29d;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding: 1.5em 0;
}

#Easyplan h2{
    color: #33333;
    font-size: 40px;
    font-weight: normal;
    text-align: center;
    line-height: 1.8;
}
#Easyplan p{
    color: #33333;
    font-size: 27px;
    text-align: center;
    line-height: 1.3;
}
#Easyplan p span{
    font-size: 17px;
}

#Easyplan .inner{
    width: 996px;
    overflow: hidden;
    margin: 1em auto 1em;
}
#Easyplan .inner dl{
    width: 990px;
}
#Easyplan .inner dt{
    height: 60px;
    color: white;
    background: #888888;
    font-size: 27px;
    line-height: 2.2;
    text-indent: 20px;
    font-weight: normal;
}
#Easyplan .inner dt span{
    float: right;
    font-size: 17px;
    padding: 15px 10px 0 0;
}

#Easyplan .inner dd{
    background: white;
    background: rgba(255,255,255,0.9);
    padding: 1em;
    border: #888888 solid 1px;
    margin-top: 5px;
    /*min-height: 600px;*/
	min-height: 700px;
    color: #888888;
}


#Easyplan .inner dl:nth-child(1){
    float: left;
}

#Easyplan .inner dl:nth-child(2) dt{
    background: #178eb5;
}
#Easyplan .inner dl:nth-child(2) dd{
    color: #178eb5;
    border-color: #178eb5;
}



/****************************************************
SMARTPHONE PLAN
****************************************************/
#plan4 .inner li:nth-child(2){
    background-color: #9d91c5;
}
#plan4 .inner li:nth-child(2) strong{
    background: #000;
}
#plan4 .inner li:nth-child(2) dt,
#plan4 .inner li:nth-child(2) ul li{
    color: #000;
}

#plan4 .inner li:nth-child(2) ul li{
    border-color: #000;
}
#plan4 .inner li:nth-child(2) dl dd a {
	-moz-box-shadow: 0 1px 0 rgba(0,35,67,.63); /* drop shadow */
	-webkit-box-shadow: 0 1px 0 rgba(0,35,67,.63); /* drop shadow */
	box-shadow: 0 1px 0 rgba(0,35,67,.63); /* drop shadow */
	background-image: -moz-linear-gradient(bottom, #4d4a99 0%, #4d4a99 49.9%, #4d4a99 50.29%, #4d4a99 100%); /* gradient overlay */
	background-image: -o-linear-gradient(bottom, #4fa9ff 0%, #4fa9ff 49.9%, #61b3ff 50.29%, #61b3ff 100%); /* gradient overlay */
	background-image: -webkit-linear-gradient(bottom, #4fa9ff 0%, #4fa9ff 49.9%, #61b3ff 50.29%, #61b3ff 100%); /* gradient overlay */
	background-image: linear-gradient(bottom, #4fa9ff 0%, #4fa9ff 49.9%, #61b3ff 50.29%, #61b3ff 100%); /* gradient overlay */
}


#Smartplan{
    background-color: #a095c8;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding: 1.5em 0;
}

#Smartplan h2{
    color: #33333;
    font-size: 40px;
    font-weight: normal;
    text-align: center;
    line-height: 1.8;
}
#Smartplan p{
    color: #33333;
    font-size: 27px;
    text-align: center;
    line-height: 1.3;
}
#Smartplan p span{
    font-size: 17px;
}

#Smartplan .inner{
    width: 996px;
    overflow: hidden;
    margin: 1em auto 1em;
}
#Smartplan .inner dl{
    width: 990px;
}
#Smartplan .inner dt{
    height: 60px;
    color: white;
    background: #888888;
    font-size: 27px;
    line-height: 2.2;
    text-indent: 20px;
    font-weight: normal;
}
#Smartplan .inner dt span{
    float: right;
    font-size: 17px;
    padding: 15px 10px 0 0;
}

#Smartplan .inner dd{
    background: white;
    background: rgba(255,255,255,0.9);
    padding: 1em;
    border: #888888 solid 1px;
    margin-top: 5px;
    /*min-height: 600px;*/
	min-height: 700px;
    color: #888888;
}


#Smartplan .inner dl:nth-child(1){
    float: left;
}

#Smartplan .inner dl:nth-child(2) dt{
    background: #178eb5;
}
#Smartplan .inner dl:nth-child(2) dd{
    color: #178eb5;
    border-color: #178eb5;
}






/****************************************************
STANDARD PLAN
****************************************************/
#plan4 .inner li:nth-child(3){
    background-color: #8fc1d5;
}
#plan4 .inner li:nth-child(3) strong{
    background: #000;
}
#plan4 .inner li:nth-child(3) dt,
#plan4 .inner li:nth-child(3) ul li{
    color: #000;
}

#plan4 .inner li:nth-child(3) ul li{
    border-color: #000;
}
#plan4 .inner li:nth-child(3) dl dd a {
	-moz-box-shadow: 0 1px 0 rgba(11,40,0,.73); /* drop shadow */
	-webkit-box-shadow: 0 1px 0 rgba(11,40,0,.73); /* drop shadow */
	box-shadow: 0 1px 0 rgba(11,40,0,.73); /* drop shadow */
	background-image: -moz-linear-gradient(bottom, #3a9abd 0%, #3a9abd 49.71%, #3a9abd 50.29%, #3a9abd 100%); /* gradient overlay */
	background-image: -o-linear-gradient(bottom, #61cf37 0%, #61cf37 49.71%, #81d95f 50.29%, #81d95f 100%); /* gradient overlay */
	background-image: -webkit-linear-gradient(bottom, #61cf37 0%, #61cf37 49.71%, #81d95f 50.29%, #81d95f 100%); /* gradient overlay */
	background-image: linear-gradient(bottom, #61cf37 0%, #61cf37 49.71%, #81d95f 50.29%, #81d95f 100%); /* gradient overlay */
}


#Standplan{
    background-color: #91c2d6;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding: 1.5em 0;
}

#Standplan h2{
    color: #33333;
    font-size: 40px;
    font-weight: normal;
    text-align: center;
    line-height: 1.8;
}
#Standplan p{
    color: #33333;
    font-size: 27px;
    text-align: center;
    line-height: 1.3;
}
#Standplan p span{
    font-size: 17px;
}

#Standplan .inner{
    width: 996px;
    overflow: hidden;
    margin: 1em auto 1em;
}
#Standplan .inner dl{
    width: 990px;
}
#Standplan .inner dt{
    height: 60px;
    color: white;
    background: #888888;
    font-size: 27px;
    line-height: 2.2;
    text-indent: 20px;
    font-weight: normal;
}
#Standplan .inner dt span{
    float: right;
    font-size: 17px;
    padding: 15px 10px 0 0;
}

#Standplan .inner dd{
    background: white;
    background: rgba(255,255,255,0.9);
    padding: 1em;
    border: #888888 solid 1px;
    margin-top: 5px;
    /*min-height: 600px;*/
	min-height: 700px;
    color: #888888;
}


#Standplan .inner dl:nth-child(1){
    float: left;
}

#Standplan .inner dl:nth-child(2) dt{
    background: #178eb5;
}
#Standplan .inner dl:nth-child(2) dd{
    color: #178eb5;
    border-color: #178eb5;
}





#FreeSurvice{
    background-image: url(../img/bg01_pc.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding: 1.5em 0;
}

#FreeSurvice h2{
    color: #333333;
    font-size: 50px;
    font-weight: normal;
    text-align: center;
    line-height: 1.8;
}
#FreeSurvice p{
    color: #333333;
    font-size: 27px;
    text-align: center;
    line-height: 1.3;
}
#FreeSurvice p span{
    font-size: 17px;
}

#FreeSurvice .inner{
    width: 996px;
    overflow: hidden;
    margin: 2em auto 1em;
}
#FreeSurvice .inner dl{
    width: 990px;
}
#FreeSurvice .inner dt{
    height: 60px;
    color: white;
    background: #888888;
    font-size: 27px;
    line-height: 2.2;
    text-indent: 20px;
    font-weight: normal;
}
#FreeSurvice .inner dt span{
    float: right;
    font-size: 17px;
    padding: 15px 10px 0 0;
}

#FreeSurvice .inner dd{
    background: white;
    background: rgba(255,255,255,0.9);
    padding: 1em;
    border: #888888 solid 1px;
    margin-top: 5px;
    /*min-height: 600px;*/
	min-height: 700px;
    color: #888888;
}


#FreeSurvice .inner dl:nth-child(1){
    float: left;
}



#FreeSurvice .inner dl:nth-child(2) dt{
    background: #178eb5;
}
#FreeSurvice .inner dl:nth-child(2) dd{
    color: #178eb5;
    border-color: #178eb5;
}


#contact{
    text-align: center;
    color: #019ddd;
    padding: 2em 0;
}

#contact h2{
    font-size: 35px;
    font-weight: normal;
    line-height: 1.4;
}
#contact dl dt{
    font-size: 21px;
    padding-top: 1em;
}
#contact dl dd:nth-child(2){
    padding-bottom: 1em;
}
#contact dl dd:nth-child(2) a{
    font-size: 50px;
    color: #019ddd;
    line-height: 1;
}


footer{
    width: 100%;
    background: #019ddd;
}
footer .inner{
width: 1000px;
overflow: hidden;
margin: 0 auto;

}

footer .inner > p {
  float: left;
  line-height: 1;
  padding: 25px 25px 0 0;
  color: #3bb2d8;
}
footer .inner > p strong{
    display: block;
    font-weight: normal;
}
footer .inner > p a{
  font-size: 40px;
  line-height: 1.2;
}

footer .inner div{
  float: left;
    padding: 25px;
    width: auto;
    overflow: hidden;
}
footer .inner div ul{
    width: 960px;
    overflow: hidden;
    padding-top: .5em;
}
footer .inner div ul li{
    float: right;
    font-size: 14px;
    padding-left: 1em;
}
footer .inner div ul li i{
    padding-right: 3px;
}

footer #copy{
    font-family: serif;
    color: #fff;
    font-size: 10px;
    text-align: center;
    padding: 1em 0;
    border-top: #d9ebf5 solid 1px;
}


/****************************************************
detailpage
plan01.html
****************************************************/
#plan01.plan #wrap{border-top: #bb9749 solid 50px;}
#plan01 header{color: #ffffff;}
#plan01.plan #wrap{background: #dfd399;}

#plan02.plan #wrap{border-top: #4faaff solid 50px;}
#plan02 header{color: #4faaff;}
#plan02.plan #wrap{background: #fff;}

#plan03.plan #wrap{border-top: #62d037 solid 50px;}
#plan03 header{color: #62d037;}
#plan03.plan #wrap{background: #fff;}

#plan04.plan #wrap{border-top: #f51b39 solid 50px;}
#plan04 header{color: #f51b39;}
#plan04.plan #wrap{background: #f7f7f7;}

#wrap{
    height: 100%;
    width: 100%;
    display: block;
    position: relative;
}



.plan article{
    position: relative;
    z-index: 99;
    width: 1000px;
    margin: 0 auto;
    text-align: center;
}

.plan article header h1{
    font-size: 69px;
    font-weight: normal;
    line-height: 1.2;
    padding-top: 1em;
}
.plan article header p{
    font-size: 34px;
}



section#data{
    width: 100%;
    overflow: hidden;
    padding-top: 3em;
    position: relative;
}
section#data #mainvisual{
    float: left;
}
section#data dl#plantext{
    float: right;
    width: 570px;
    text-align: left;
}

section#data dl#plantext dt{
    font-size: 34px;
    line-height: 1.2;
    padding-bottom: .5em;
}

section#data dl#plantext dd:nth-child(3){
    padding-top: 2em;
}

section#data dl#plantext dd:nth-child(3) strong{
    font-size: 22px;
    font-weight: normal;
    padding-bottom: .5em;
}

section#data dl#plantext dd:nth-child(3) ul{
    width:auto;
    background: #fff;
    border-radius: 6px;
    overflow: hidden;
    padding: 10px 0 10px 10px;
}
section#data dl#plantext dd:nth-child(3) ul li{
    float: left;
    width: 50px;
    height: 50px;
    margin-right: 10px;
    background: #bbb;
    border-radius: 3px;
}

section#data dl#plantext dd:nth-child(3) ul li.off{
    background: #ddd;
}


#Chart{
    position: absolute;
    width: 380px;
    left: 0;
    top: 450px;
}

#canvas{
    background: #fff;
    border-radius: 190px;
    padding: 10px;
}

dl#exsample{
    float: right;
    width: 570px;
    text-align: left;
    padding-top: 2em;
}
dl#exsample dt{
    font-size: 22px;
    padding-bottom: .5em;
}

dl#exsample dd ul{
    width: 100%;
    overflow: hidden;
}
dl#exsample dd ul li{
    width:280px;
    overflow: hidden;
    padding-bottom: 2em;
}

dl#exsample dd ul li strong{
    display: block;
    padding: 1em 0 0;
    font-size: 16px;
}
dl#exsample dd ul li p{
    height: 8em;
    line-height: 1.5;
    font-size: 14px;
}

dl#exsample dd ul li:nth-child(2n-1){
    float: left;
}

dl#exsample dd ul li:nth-child(2n){
    float: right;
}

section#price{
    width:auto;
    padding: 30px;
    overflow: hidden;
    background: #fff;
    color: #333333;
    text-align: left;
    margin-top: 1em;
    border-radius: 6px;
}


section#price h2{
    font-size: 18px;
    font-weight: normal;
	text-align: left;
}

.tablebox table{
  border-collapse: separate;
  border-spacing: 1px;
  clear: both;
  width: 100%;

}
.tablebox table th{
background: #888888;
color: white;
font-size: 17px;
font-weight: normal;
padding: 1em;
text-align: left;
vertical-align: middle;
}
#first{
    margin-bottom: 1em;
}
#first th{
    width: 50%;
}
#first th small{
    font-size: .8em;
}
#first td{
    text-align: center;
    vertical-align: middle;
    font-size: 63px;
    line-height: 1.2;
    border: #888888 solid 1px;
}
#first td small{
    display: block;
    font-size: 30px;
}

.tablebox div{
    width: 50%;
    overflow: hidden;
}
.tablebox div table{
    width: 100%;
}
.tablebox div table th{
    width: 30%;
    padding: 1em 0 1em 1em;
}
.tablebox div table td{
     border: #888888 solid 1px;
     vertical-align: middle;
     padding: 1em 0 1em .5em;
     font-size: 17px;
     line-height: 1.3;
}

.tablebox div table td small{
    font-size: .7em;
}


#option{
    clear: both;
    text-align: center;
    padding: 1em 0;
    font-size: 21px;
}

#option a i{
    padding-right: .3em;
}


.pageback{
    position: absolute;
    right: 20px;
    top: -42px;
    z-index: 1000;
    font-size: 20px;
}

.pageback a{
    color: white;
}
.pageback a i{
    padding-right: .5em;
}

/****************************************************
tk
****************************************************/
html,#top.thanks{
    height: 100%;
}
#top.thanks{
  background-image: url("../img/bgblue_pc.png");
  background-position: center center;
  background-repeat:repeat;
  background-size: 100% 100%;
}



#top.thanks section#form {
  background: none;
  padding: 30px 0;
  display: block;
  padding-bottom: 202px;
}
#top.thanks header{
    background: #fff;
}
#top.thanks article{
    display: block;
    width: auto;
    overflow: hidden;
}

#top.thanks #form .inner {
  background: none repeat scroll 0 0 rgba(255, 255, 255, 0.9);
  border-radius: 6px;
  margin: 0 auto 0;
  padding:60px 60px;
  width: 600px;
  overflow: hidden;
  clear: both;
}
#top.thanks #form .inner h2{
  color: #3bb2d8;
}
#top.thanks #form .inner h2 i{
    font-size: 60px;
}
#thanksWrap{
    height:auto;
    min-height: 100%;
    width: 100%;
    overflow: hidden;
}
#top.thanks footer{
    position:relative;
    width: 100%;
    overflow: hidden;
    display: block;
    margin-top: -172px;
    height: 172px;
}