@charset "UTF-8";
html,#wrap {
    min-width: 0;
}
#main {
    -webkit-font-smoothing: antialiased;
    font-size: 1rem;
    position: relative;
	clear:both;
}
#main * {
    padding: 0;
    margin: 0;
}
#main sup {
    font-size: 0.5rem;
}
#main .fcl {
	zoom: 100%;
}
#main .fcl:after {
	content: " "; 
	clear: both; 
	height: 0; 
	display: block; 
	visibility: hidden;
}
#main img {
	vertical-align:middle;
	margin:0;
	padding:0;
}
#main .onlyPc { display: block; }
#main img.onlyPc { display: inline-block; }
#main .onlySp { display: none; }
#main img.onlySp { display: none; }
@media screen and (max-width: 750px){
    #main .onlyPc { display: none; }
    #main img.onlyPc { display: none; }
    #main .onlySp { display: block; }
    #main img.onlySp { display: inline-block; }
}

#info .onlyPc { display: block; }
#info img.onlyPc { display: inline-block; }
#info .onlySp { display: none; }
#info img.onlySp { display: none; }
@media screen and (max-width: 750px){
    #info .onlyPc { display: none; }
    #info img.onlyPc { display: none; }
    #info .onlySp { display: block; }
    #info img.onlySp { display: inline-block; }
}

#main #ancnav {
    position: fixed;
    top: 50%;
    right: 24px;
    text-align: center;
    z-index: 100;
}
#main #ancnav ul {
    letter-spacing: -1em;
    line-height: 0;
}
#main #ancnav ul li {
    position: relative;
    margin: 7px 0;
    width: 14px;
    height: 14px;
    text-align: center;
}
#main #ancnav ul li a{
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}
#main #ancnav ul li a:before,
#main #ancnav ul li a:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 8px;
    height: 8px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;

    -webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    -ms-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
}
#main #ancnav ul li a:before {
    top: 3px;
    left: 3px;
    background-color: #ffffff;
}
#main #ancnav.gray ul li a:before {
    background-color: #a9b4bc;
}
#main #ancnav ul li a:after {
    opacity: 0;
    border: 3px solid #ffffff;
    background-color: transparent;
}
#main #ancnav.gray ul li a:after {
    border: 3px solid #a9b4bc;
}
#main #ancnav ul li.active a:before{ opacity: 0; }
#main #ancnav ul li.active a:after{ opacity: 1; }

#main .snsnav {
    position: absolute;
    top: 15px;
    right: 23px;
    display: table;
}
#main .snsnav > div,
#main .snsnav ul {
    display: table-cell;
    vertical-align: middle;
}
#main .box .snsnav .ttl {
    font-size: 0.68rem;
    padding: 0 12px 0 0;
}
#main .snsnav[data-theme="white"] { color: #ffffff; }
#main .snsnav ul {
    letter-spacing: -1em;
}
#main .snsnav ul li {
    display: inline-block;
    width: 32px;
    padding: 0 0 0 6px;
}
#main .snsnav ul li:last-child { display: none; }
#main .snsnav ul li a {
    position: relative;
    display: block;
    width: 32px;
    height: 32px;
    -webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    -ms-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
    text-decoration: none;
    overflow: hidden;
    text-indent: -10000px;
}
#main .snsnav ul li a:before,
#main .snsnav ul li a:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    background: no-repeat center;
    -webkit-background-size: contain;
    background-size: contain;
}
#main .snsnav ul li a:after { opacity: 0; }
#main .snsnav[data-theme="white"] ul li a:before { opacity: 0; }
#main .snsnav[data-theme="white"] ul li a:after { opacity: 1; }
#main .snsnav ul li a.tw:before { background-image: url(../img/sns_tw_g.png); }
#main .snsnav ul li a.tw:after { background-image: url(../img/sns_tw_w.png); }
#main .snsnav ul li a.fb:before { background-image: url(../img/sns_fb_g.png); }
#main .snsnav ul li a.fb:after { background-image: url(../img/sns_fb_w.png); }
#main .snsnav ul li a.gp:before { background-image: url(../img/sns_gp_g.png); }
#main .snsnav ul li a.gp:after { background-image: url(../img/sns_gp_w.png); }
#main .snsnav ul li a.li:before { background-image: url(../img/sns_li_g.png); }
#main .snsnav ul li a.li:after { background-image: url(../img/sns_li_w.png); }



#main .box {
    height: 660px;
    position: relative;
    background: no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 108px 0 0;
    overflow: hidden;

    letter-spacing: 0.075em;
}
#index #main .box {
    height: 700px;
    padding: 71px 0 0;
}
#main #p1 {
    padding-top: 0;
}

#main .box h2,
#main .box h3,
#main .box h4 {
    font-weight: 200;
}
#main .box h3 {
    letter-spacing: 0.2em;
}
#main .box h4 {
    letter-spacing: 0;
}
#main .box .content {
    position: relative;
    max-width: 980px;
    height: 100%;
    margin: 0 auto;
}
#main .box .content .inner {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0 auto;
}
#main .box .content .inner .item {
    position: absolute;
    top: 0;
    left: 0;
}

#main #cfooter .cfooterinner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
#main #cfooter .nav {
    position: absolute;
    top: 4.2%;
    left: 0;
    width: 100%;
    height: 18.2%;
}
#main #cfooter .nav ul {
    width: 100%;
    height: 100%;
    letter-spacing: -1em;
    text-align: center;
}
#main #cfooter .nav ul li {
    position: relative;
    display: inline-block;
    width: 20%;
    height: 50%;
    padding: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#main #cfooter .nav ul li a {
    display: table;
    width: 100%;
    height: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

    border: 1px solid #909090;
    color: #666666;
    font-size: 0.8125rem;
    letter-spacing: 0;
    text-decoration: none;

    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
#main #cfooter .nav ul li a span {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
	line-height:1.1rem;
}
#main #cfooter .nav ul li a:after {
    content: '';
    position: absolute;
    top: 50%;
    right: 7%;
    margin: -5px 0 0;
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 8px;
    border-color: transparent transparent transparent #909090;
    -webkit-transition: border-color 0.3s;
    -moz-transition: border-color 0.3s;
    -ms-transition: border-color 0.3s;
    -o-transition: border-color 0.3s;
    transition: border-color 0.3s;
}
#main #cfooter .pdf {
    position: absolute;
    top: 27.7%;
    left: 0;
    width: 100%;
    height: 39.2%;
    text-align: center;
}
#main #cfooter .pdf a {
    height: 100%;
}
#main #cfooter .pdf a img {
    width: auto;
    max-height: 100%;
}
#main #cfooter .bn {
    position: absolute;
    top: 72.2%;
    left: 0;
    width: 100%;
    height: 17.1%;
    text-align: center;
}
#main #cfooter .bn a {
    display: inline-block;
    height: 100%;
}
#main #cfooter .bn a img {
    width: auto;
    max-height: 100%;
}
#main #cfooter .sp-bn{ display:none;}

#index #main .box,
#index #main .box a {
    color: #ffffff;
}
#index #main .box[data-theme="gray"],
#index #main .box[data-theme="gray"] a{
    color: #333333;
}
#index #main .box[data-theme="gray"] h3,
#index #main .box[data-theme="gray"] h4 {
    color: #000000;
}
#index #main .box h3 span {
    display: inline-block;
    font-size: 2.5rem;
    line-height: 1;
    padding: 0 0 8px;
    border-bottom: 1px solid #ffffff;
}
#index #main .box[data-theme="gray"] h3 span { border-bottom-color: #000000; }
#index #main .box h4 {
    font-size: 2rem;
    line-height: 1.625em;
    padding: 3% 0 2%;
}
#index #main .box p {
    line-height: 2.125em;
    padding: 0 0 3.5%;
}
#index #main .box .btn {
    width: 30.6%;
    padding: 0 0 3.5%;
}
#index #main .box .btn a {
    position: relative;
    display: block;
    height: 45px;
    border: 1px solid #ffffff;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
#index #main .box .btn a > span {
    position: absolute;
    top: 0;
    left: 0;
    display: table;
    width: 100%;
    height: 100%;
}
#index #main .box .btn a > span span {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    padding: 0 11.6% 0 0;
    line-height: 1em;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

    font-size: 0.93rem;
    letter-spacing: 0;
}
#index #main .box .btn a:after {
    content: '';
    position: absolute;
    top: 50%;
    right: 6%;
    margin: -5px 0 0;
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 8px;
    border-color: transparent transparent transparent #ffffff;

    -webkit-transition: border 0.3s;
    -moz-transition: border 0.3s;
    -ms-transition: border 0.3s;
    -o-transition: border 0.3s;
    transition: border 0.3s;
}
#index #main .box[data-theme="gray"] .btn a {
    border-color: #909090;
    color: #666666;
}
#index #main .box[data-theme="gray"] .btn a:after { border-color: transparent transparent transparent #909090; }
#index #main .box .img img { width: 100%; }

#index #main #p1 {
    padding-top: 0;
    background: url(../img/index_p1_bg.jpg) repeat-x left bottom;
    -webkit-background-size: auto 100%;
    background-size: auto 100%;
}
#index #main #p1 .inner {
    width: 100%;
}
#index #main #p1 .inner .img {
    width: 51%;
    top: 8.3%;
    height: 100%;
}
#index #main #p1 .inner .img img { width: 100%; }
#index #main #p1 .inner .wrap {
    position: absolute;
    top: 0;
    left: 54.5%;
    width: 100%;
    height: 100%;
}
#index #main #p1 .content h2 {
    top: 32%;
    width: 28.7%;
    line-height: 0;
}
#index #main #p1 .content h2 img { width: 100%; }
#index #main #p1 .content h3 {
    font-weight: 200;
    top: 7%;
    font-size: 1.875rem;
    line-height: 1.5em;
    letter-spacing: 0.1em;
}
#index #main #p1 .content .bn {
    top: 39.2%;
    width: 100%;
}
#index #main #p1 .content .bn .img {
    display: block;
    width: 39.1%;
}
#index #main #p1 .content .bn img{ max-width: 100%; }
#index #main #p1 .content .bn p {
    padding: 0.5% 0 0;
    font-size: 0.875rem;
    line-height: 1.2em;
    letter-spacing: 0;
}
#index #main #p1 .content .logos {
	top: 58.9%;
    width: 44.6%;
}
#index #main #p1 .content .logos img {
	width:100%;
}
#index #main #p1 .content .carrier {
    top: 0;
    left: 30.3%;
    min-width: 98px;
}
#index #main #p1 .content .carrier a {
    letter-spacing: 0;
    display: block;
    font-size: 0.812rem;
    line-height: 1em;
    padding: 10px;
    text-align: center;
    border: 1px solid #cccccc;
    text-decoration: none;

    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
#index #main #p1 .content .nav {
    top: 85%;
    display: table;
    width: 100%;
}
#index #main #p1 .content .nav li {
    width: 25%;
    display: table-cell;
    padding: 0 5px;
}
#index #main #p1 .content .nav li:first-child { padding: 0 5px 0 0; }
#index #main #p1 .content .nav li:last-child { padding: 0 0 0 5px; }
#index #main #p1 .content .nav li a {
    position: relative;
    display: block;
    border: 1px solid #666666;
    width: 100%;
    height: 40px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 38px;
    text-decoration: none;
    color: #666666;

    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
#index #main #p1 .content .nav li.n1 a { padding-left: 56px; }
#index #main #p1 .content .nav li.n2 a { padding-left: 46px; }
#index #main #p1 .content .nav li.n3 a { padding-left: 40px; }
#index #main #p1 .content .nav li.n4 a { padding-left: 48px; }
#index #main #p1 .content .nav li a:after {
    content: '';
    position: absolute;
    top: 50%;
    right: 6%;
    margin: -5px 0 0;
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 8px;
    border-color: transparent transparent transparent #666666;

    -webkit-transition: border 0.3s;
    -moz-transition: border 0.3s;
    -ms-transition: border 0.3s;
    -o-transition: border 0.3s;
    transition: border 0.3s;
}
#index #main #p1 .content .nav li a span {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    height: 100%;
}
#index #main #p1 .content .nav li.n1 a span { width: 56px; }
#index #main #p1 .content .nav li.n2 a span { width: 46px; }
#index #main #p1 .content .nav li.n3 a span { width: 40px; }
#index #main #p1 .content .nav li.n4 a span { width: 48px; }
#index #main #p1 .content .nav li a span:before,
#index #main #p1 .content .nav li a span:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    background: no-repeat left center;
    -webkit-background-size: auto 100%;
    background-size: auto 100%;

    -webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    -ms-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
}
#index #main #p1 .content .nav li a span:after { opacity: 0; }
#index #main #p1 .content .nav li.n1 a span:before { background-image: url(../img/index_p1_nav2.png); }
#index #main #p1 .content .nav li.n2 a span:before { background-image: url(../img/index_p1_nav1.png); }
#index #main #p1 .content .nav li.n3 a span:before { background-image: url(../img/index_p1_nav4.png); }
#index #main #p1 .content .nav li.n4 a span:before { background-image: url(../img/index_p1_nav3.png); }
#index #main #p1 .content .nav li.n1 a span:after { background-image: url(../img/index_p1_nav2_on.png); }
#index #main #p1 .content .nav li.n2 a span:after { background-image: url(../img/index_p1_nav1_on.png); }
#index #main #p1 .content .nav li.n3 a span:after { background-image: url(../img/index_p1_nav4_on.png); }
#index #main #p1 .content .nav li.n4 a span:after { background-image: url(../img/index_p1_nav3_on.png); }

#index #main #p3 { background-image: url(../img/index_p2_bg.jpg); }
#index #main #p3 h3 { padding-top: 7.1%; }
#index #main #p3 .note {
    display: table;
    width: 30.6%;
}
#index #main #p3 .note > div {
    display: table-cell;
    vertical-align: top;
    font-size: 0.875rem;
    line-height: 1.42em;
}
#index #main #p3 .img {
    top: 12.8%;
    left: 50%;
    height: 74.7%;
}
#index #main #p2 { background-image: url(../img/index_p3_bg.jpg); }
#index #main #p2 .inner { padding-left: 38.8%; }
#index #main #p2 h3 { padding-top: 10.2%; }

#index #main #p5 { background-image: url(../img/index_p4_bg.jpg); }
#index #main #p5 h3 { padding-top: 15.1%; }
#index #main #p5 .img {
    top: 25.1%;
    left: 66.1%;
    width: 23%;
}

#index #main #p6 { background-image: url(../img/index_p5_bg.jpg); }
#index #main #p6 h3 { padding-top: 16.7%; }
#index #main #p6 h3,
#index #main #p6 h4,
#index #main #p6 p,
#index #main #p6 .btn { padding-left: 38.7%; }
#index #main #p6 .img {
    top: -9%;
    left: -10%;
    height: 110%;
}
#index #main #p6 .img img { width: auto; height: 100%; }

#index #main #p7 { background-image: url(../img/index_p6_bg.jpg); }
#index #main #p7 h3 { padding-top: 11.2%; }
#index #main #p7 .img {
    top: 10.8%;
    left: 71.9%;
    height: 27.8%;
}

#index #main #p4 { background-image: url(../img/index_p7_bg.jpg); }
#index #main #p4 h3 { padding-top: 12.7%; }
#index #main #p4 .img {
    top: 23.4%;
    left: 43.1%;
    width: 56.8%;
}

#index #main #p8 { background-image: url(../img/index_p8_bg.jpg); }
#index #main #p8 h3,
#index #main #p8 h4,
#index #main #p8 p,
#index #main #p8 .btn { padding-left: 55.9%; }
#index #main #p8 h3 { padding-top: 11.2%; }
#index #main #p8 h3 span { line-height: 1.4em; }
#index #main #p8 .img {
    top: 32.5%;
    left: 0;
    width: 49.6%;
}

#main.underPage > h1 {
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 50;
}
#main.underPage .box {
    color: #ffffff;
}
#main.underPage .box[data-theme="gray"] { color: #333333; }
#main.underPage .box .inner {
    width: 100%;
}
#main.underPage .box p {
    font-size: 1rem;
    line-height: 2.125em;
}
#main.underPage .box .pageHader {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    text-align: center;
}
#main.underPage .box .pageHader h2 {
    padding: 2.7% 0 0;
    font-weight: 300;
}
#main.underPage .box .pageHader h2 span {
    display: block;
    width: 69.3%;
    margin: 0 auto;
    padding: 0 0 1.8%;
    border-bottom: 2px solid #ffffff;

    font-size: 3rem;
    line-height: 1em;
    letter-spacing: 0.18em;
}
#main.underPage .box[data-theme="gray"] h2 span {
    color: #000000;
    border-bottom-color: #000000;
}
#main.underPage .box h3 {
    width: 100%;
    text-align: center;
    font-size: 2rem;
    line-height: 1.68em;
    font-weight: 300;
    letter-spacing: 0.075em;
}
#main.underPage .box[data-theme="gray"] h3 { color: #000000; }
#main.underPage .box h4,
#main.underPage .box h5{
    font-size: 1.53rem;
    line-height: 1.7em;
    font-weight: 300;
    letter-spacing: 0.075em;
}
#main.underPage .box[data-theme="gray"] h4,
#main.underPage .box[data-theme="gray"] h5 { color: #000000; }
#main.underPage .box .inner > .img {
    width: 100%;
    text-align: center;
}
#main.underPage .box .inner > .img img { max-width: 100%; }
#main.underPage .box .note { width: 100%; }
#main.underPage .box .note .attention {
    font-size: 0.6875rem;
}


#camera #main #p1 { background-image: url(../img/camera_p1_bg.jpg); }
#camera #main #p1 h3 { top:19.1%; }
#camera #main #p1 p {
    top:70.5%;
    width: 100%;
    text-align: center;
}
#camera #main #p2 h3 { top: 12.2%; }
#camera #main #p2 .img { top: 34.3%; }
#camera #main #p3 { background-color: #bfb3a3; }
#camera #main #p3 h3 { top: 12.2%; }
#camera #main #p3 .img { top: 25.4%; }
#camera #main #p3 .note { top: 71.2%; }
#camera #main #p4 { background-image: url(../img/camera_p4_bg.jpg); }
#camera #main #p4 h3 { top: 7.5%; }
#camera #main #p4 .note { top: 76.5%; }
#camera #main #p5 { background-image: url(../img/camera_p5_bg.jpg); }
#camera #main #p5 .img { top: 26.5%; }
#camera #main #p6 { background-color: #f3f3f3; }
#camera #main #p6 h3 { top: 6%; letter-spacing: 0; }
#camera #main #p6 .img { top: 18.9%; }
#camera #main #p6 .note { top: 76.5%; }
#camera #main #p7 { background-color: #50acba; }
#camera #main #p7 h3 { top: 10%; }
#camera #main #p7 .note h4 {
    font-size: 1.625rem;
    line-height: 1.3em;
    padding: 0 0 1.8%;
}
#camera #main #p7 .note h5 img {
    display: inline-block;
    margin: -3px 0 0 3px;
}
#camera #main #p7 .note.n1 { top: 25%; }
#camera #main #p7 .note.n2 { top: 60.6%; }
#camera #main #p7 .img {
    left: 60.2%;
    width: 39.7%;
}
#camera #main #p7 .img.i1 { top: 23.6%; }
#camera #main #p7 .img.i2 { top: 57.2%; }
#camera #main #p8 {
    background: url(../img/camera_p8_bg.png) no-repeat center,
                url(../img/camera_p8_bg2.jpg) repeat-x left bottom;
    background-size: auto, auto 100%;
}
#camera #main #p8 h3 { top: 6.9%; letter-spacing: 0; }
#battery #main #p1 { background-image: url(../img/battery_p1_bg.jpg); }
#battery #main #p1 h3 { top:24.3%; left: 38.4%; text-align: left; }
#battery #main #p1 .note { top: 45.2%; left: 38.4%; }
#battery #main #p2 { background-color: #6bbbc7; }
#battery #main #p2 h3 { top:12.1%; }
#battery #main #p2 .img { top:28.7%; }
#battery #main #p2 .img img { width: 55.2%; }
#battery #main #p2 .note { top: 64.8%; text-align: center; }
#battery #main #p3 { background-image: url(../img/battery_p3_bg.jpg); }
#battery #main #p3 h3 { top:9%; text-align: left; }
#battery #main #p3 .note { top: 75%;  }
#battery #main #p4 { background-color: #c6c96c; }
#battery #main #p4 h3 { top:12.1%; }
#battery #main #p4 .img { top:24.7%; }
#battery #main #p4 .img img { width: 31.5%; }

#toughness #main #p1 { background-image: url(../img/toughness_p1_bg.jpg); }
#toughness #main #p1 .pageHader h2 { padding-top: 7.4%; }
#toughness #main #p1 h3 { top:27.8%; }
#toughness #main #p2 { background-image: url(../img/toughness_p2_bg.jpg); padding-top: 0; }
#toughness #main #p2 .img {
    position: absolute;
    top: 10.9%;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../img/toughness_p2_img.png) no-repeat center top;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
}

#toughness #main #p3 { background-image: url(../img/toughness_p3_bg.jpg); }
#toughness #main #p3 .img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../img/toughness_p3_img.png) no-repeat center;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
}

#toughness #main #p4 { background-color: #f3f3f3; }
#toughness #main #p4 h3 { top:12.1%; }
#toughness #main #p4 .img { top:31%; }
#toughness #main #p4 .note { top: 78%; text-align: center; }
#toughness #main #p5 { background-color: #75a9a8; }
#toughness #main #p5 .img { top:14.8%; }
#toughness #main #p5 .img img { width: 82.1%; }
#toughness #main #p5 .note { top: 65.1%; text-align: center; }

#text #main .box h3 { text-align: left; }
#text #main #p1 { background-image: url(../img/text_p1_bg.jpg); }
#text #main #p1 h3 { top:41.8%; }
#text #main #p2 { background-color: #f3f3f3; }
#text #main #p2 h3 { top:13.6%; }
#text #main #p2 .img.i1 { top:37.1%; text-align: left; }
#text #main #p2 .img.i1 img { width:50%; }
#text #main #p2 .img.i2 { top:14.2%; text-align: right; }
#text #main #p2 .img.i2 img { width:44.8%; }
#text #main #p2 .img.i3 { top:73.6%; text-align: left; }
#text #main #p2 .img.i3 img { width:18%; }
#text #main #p2 .atok {
    top:72.2%;
    left: 19.3%;
    width: 80.6%;
    font-size: 0.875rem;
    line-height: 1.42em;
}
#text #main #p3 { background-image: url(../img/text_p3_bg.jpg); }
#text #main #p3 h3 { top:16.6%; }
#text #main #p3 .img { top:43.4%; }
#text #main #p3 .img img { width:87.5%; }
#text #main #p4 { background-color: #a9b4bc; }
#text #main #p4 h3 { top:15.4%; left: 7.1%; }
#text #main #p4 .note { top: 25.7%; left: 7.1%; }
#text #main #p4 .img { top:43.3%; left: 7.1%; text-align: left; }
#text #main #p4 .img img { width:85.3%; }

#japan #main #p1 { background-image: url(../img/japan_p1_bg.jpg); }
#japan #main #p1 h3 { top:37.8%; text-align: left; }
#japan #main #p1 .note.n1 { top:58.7%; }
#japan #main #p1 .note.n1 p { font-size:0.97rem; }
#japan #main #p1 .note.n2 { top:72.1%; }
#japan #main #p1 .img { top:26.1%; text-align: right; }
#japan #main #p1 .img img { width:53.8%; }

#japan #main #p2 { background-color: #f3f3f3; }
#japan #main #p2 h3 { top:27.5%; left:27.5%;  text-align:left;}
#japan #main #p2 .note { top:38.1%; left:27.5%; }
#japan #main #p2 .attention { top: 56.1%; left: 7.5%; }
#japan #main #p2 .img { top:26.9%; left:7.4%; text-align: left;}
#japan #main #p2 .img img { width:17.4%; }

#japan #main #p3 h3 { top:7.5%; text-align: left; }
#japan #main #p3 .img { top: 15.5%; text-align: right;}
#japan #main #p3 .img img { width:89.3%; }
#japan #main #p4 { background-color: #f3f3f3; }
#japan #main #p4 h3 { top:21.9%; }
#japan #main #p4 .img { top:51.5%;}
#japan #main #p4 .img img { width:77.9%; }
#japan #main #p5 { background-image: url(../img/japan_p4_bg.jpg); }
#japan #main #p5 h3 { top:15.3%; left:40.8%; text-align: left; }
#japan #main #p5 .note.n1 { top:31.7%; left:40.8%; width: 59.1%; }
#japan #main #p5 h4 { top:55.9%; left:40.8%;  text-align: left; font-size:1.2rem;}
#japan #main #p5 .img.i1 { top:62%; left:40.8%; width: 29.5%; text-align: left;}
#japan #main #p5 .img.i2 { top:63.6%; left:71.4%; width: 35.5%; text-align: left;}
#japan #main #p6 { background-color: #50acba; }
#japan #main #p6 h3 { text-align: left; }
#japan #main #p6 h3.h1 { top:14.5%; }
#japan #main #p6 h3.h2 { top:47.8%; }
#japan #main #p6 .note.n1 { top:23.4%; }
#japan #main #p6 .note.n2 { top:56.6%; }
#japan #main #p6 .note.n2 .attention {
    display: block;
    padding-top: 1%;
    line-height: 1.6em;
    letter-spacing: 0;
}
#japan #main #p7 { background-image: url(../img/japan_p7_bg.jpg); }
#japan #main #p7 h3 { top:13%; }
#japan #main #p7 h4 {
    top:31%;
    font-size: 1.625rem;
    line-height: 1.53em;
}
#japan #main #p7 .note { top:48.1%; }
#japan #main #p7 .note .attention {
    display: block;
    padding-top: 1%;
    line-height: 1.6em;
    letter-spacing: 0;
}
#japan #main #p7 .img { top:30.3%; text-align: right; }
#japan #main #p7 .img img { width: 40.8%; }
#japan #main #p8 { background-image: url(../img/japan_p8_bg.jpg); }
#japan #main #p8 h3 {
    top:10.6%;
    font-size: 1.625rem;
}
#japan #main #p8 .img { top:25.7%; }
#japan #main #p8 .img img { width: 63.3%; }
#japan #main #p8 .note { top:74.5%; left: 8.5%; }
#japan #main #p9 { background-image: url(../img/japan_p9_bg.jpg); }
#japan #main #p9 h3 {
    top:19.6%;
    font-size: 1.625rem;
    text-align: left;
}
#japan #main #p9 .note.n1 { top:35.6%; }
#japan #main #p9 .note.n1 .attention {
    display: block;
    padding-top: 1%;
    line-height: 1.6em;
    letter-spacing: 0;
}
#japan #main #p9 .note.n2 { top:63.6%; left: 10.3%; width: 31.6%; }
#japan #main #p9 .img.i1 { top:21.5%; text-align: right; }
#japan #main #p9 .img.i1 img { width: 40.6%; }
#japan #main #p9 .img.i2 { top:62.4%; text-align: left; }
#japan #main #p9 .img.i2 img { width: 7.7%; }

#download #main #p1 { background-image: url(../img/download_p1_bg.jpg); }
#download #main #p1 h2 span { line-height: 1.1em; }
#download #main #p1 h3 { top:32.9%; text-align: left; }
#download #main #p1 .img { top:54.4%; text-align: left; }
#download #main #p1 .img img { width: 52%; }
#download #main #p2 h3 { top:8.3%; }
#download #main #p2 .img { top:16.9%; }
#download #main #p2 .img img { width: 81.8%; }
#download #main #p2 .note { top:70.9%; left: 8.8%; }
#download #main #p3 { background-image: url(../img/download_p3_bg.jpg); }
#download #main #p3 h3 { top:58.3%; left: 47.7%; text-align: left; }
#download #main #p3 .note { top:69.6%; left: 47.7%; }
#download #main #p4 { background-color: #7aa975; }
#download #main #p4 h3 { top:6.3%; left: 2.5%; text-align: left; }
#download #main #p4 .img { top:14.5%; }
#download #main #p4 .img img { width: 95.3%; }
#download #main #p4 p { top:69.6%; left: 2.5%; }
#download #main #p5 { background-color: #f3f3f3; }
#download #main #p5 h3 { top:6%;  }
#download #main #p5 .img { top:25.1%; }
#download #main #p5 .img img { width: 69.3%; }
#download #main #p5 p { top:87.8%; text-align: center; width: 100%; }

#design #main #p1 { background-image: url(../img/design_p1_bg.jpg); }
#design #main #p1 .img {
    width: 100%;
    height: 100%;
    background: url(../img/design_p1_img.png) no-repeat center bottom;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
}
#design #main #p1 h3 { top:20.9%; left: 36.7%; text-align: left; }
#design #main #p2 {
    background: url(../img/design_p2_bg.jpg) no-repeat center bottom,
                url(../img/design_p2_bg2.jpg) repeat-x left bottom;
    -webkit-background-size: auto 100%,auto 100%;
    background-size: auto 100%,auto 100%;
}
#design #main #p2 h3 { top:30.7%; text-align: left; }
#design #main #p2 p { top:49.2%; }
#design #main #p3 {
    background: url(../img/design_p3_bg.jpg) repeat-x left bottom;
    -webkit-background-size: auto 100%;
    background-size: auto 100%;
}
#design #main #p3 h3 { top:5.7%; }
#design #main #p3 .img { top:24.8%; }
#design #main #p3 .img img { width: 100%; }
#design #main #p3 p { top:78.5%; text-align: center; }
#design #main #p4 { background-image: url(../img/design_p4_bg.jpg); }
#design #main #p4 h3 { top:45.1%; text-align: left; }
#design #main #p4 .note { top:62%; }
#design #main #p5 { background-image: url(../img/design_p5_bg.jpg); }
#design #main #p5 .note { top:43%; }
#design #main #p6 {
    background: url(../img/design_p6_bg1.png) no-repeat left top,
                url(../img/design_p6_bg2.png) no-repeat right bottom;
    -webkit-background-size: auto 100%, contain;
    background-size: auto 100%, contain;
    background-color: #a9b4bc;
}
#design #main #p6 .note { top:18.8%; left: 35.5%; }

#spec #main #p1 { height: auto; }
#spec #main #p1 .content { height: auto; }
#spec #main #p1 .inner { height: auto; }
#spec #main #p1 .pageHader { position: relative; }
#spec #main #p1 h3 { padding: 2% 0 3%; }
#spec #main #p1 table {
    width: 100%;
    border-collapse:collapse;
    border:0;
    color: #000000;
}
#spec #main #p1 table th,
#spec #main #p1 table td {
    padding: 10px;
    border-collapse: collapse;
    border: 1px solid #AAA;
    line-height: 1.6;
    font-size: 1rem;
    font-weight: 200;
}
#spec #main #p1 table th {
    width: 15%;
    background-color: #F2F2F2;
}
#spec #main #p1 .note {
    padding: 15px 0 0;
    font-size: 0.83rem;
    line-height: 1.5em;
}
#spec #main #cfooter { height: 700px; }

#carrier #main #p1 { height: auto; }
#carrier #main #p1 .content { height: auto; }
#carrier #main #p1 .inner { height: auto; }
#carrier #main #p1 .pageHader { position: relative; }
#carrier #main #p1 h3 { padding: 4.5% 0; }
#carrier #main #p1 .list {
    width: 81.6%;
    margin: 0 auto;
    border-top: 1px solid #aaaaaa;
}
#carrier #main #p1 .list + h3 {
	padding: 9% 0 4.5%;
}
#carrier #main #p1 .list li {
    border-bottom: 1px solid #aaaaaa;
}
#carrier #main #p1 .list li a {
    display: table;
    width: 100%;
    min-height: 70px;
    text-decoration: none;
}
#carrier #main #p1 .list li a div {
    text-decoration: underline;
}
#carrier #main #p1 .list li span {
	display: table;
    width: 100%;
    min-height: 70px;
    text-decoration: none;
}
#carrier #main #p1 .list li span > div {
	 display: table-cell;
    vertical-align: middle;
	word-wrap:break-word;
	word-break:break-all;
}
#carrier #main #p1 .list li a > div {
    display: table-cell;
    vertical-align: middle;
	word-wrap:break-word;
	word-break:break-all;
}
#carrier #main #p1 .list li a > div:nth-of-type(1) {
	color: #333333;
    width: 50%;
    text-align: left;
}
#carrier #main #p1 .list li a > div:nth-of-type(2) {
    color: #000000;
    font-size: 1.125rem;
}

#info {
	border-top: 1px solid #d2d2d2;
	margin-bottom: 80px;
}
#info .link-list-col {
	margin-top: 75px;
}
#info .link-list-col h2 {
	font-size: 138.5%;
	background: url(../img/info_circle_icon.png) no-repeat left 0.2em;
	padding-left: 23px;
	line-height: 1.3;
}

#index #banner {
	border-top: 1px solid #d2d2d2;
	text-align: center;
	padding: 20px 0;
}
#index #banner a {
	display: block;
	width: 980px;
	margin: 0 auto 20px auto;
}
#index #banner a:last-child {
	margin-bottom: 0;
}
#index #banner a img {
	width: 100%;
	max-width: 100%;
}

@media (min-width: 751px) and (max-height: 550px){
    html{font-size:10px;}
    #index #main .box .inner {
        width: 62.5%;
    }
    #main.underPage .box .inner {
        width: 62.5%;
    }
    #camera #main #p8 { background-size: auto 93%, auto 93%; }
}
@media (max-height: 707px){
	#index #main #p1 .inner .img {
		    width: 40%;
	}
}
@media (min-width: 751px) and (min-height: 551px) and (max-height: 769px){
    html{font-size: 12px;}
    #index #main .box .inner {
        width: 75%;
    }
    #main.underPage .box .inner {
        width: 75%;
    }
    #camera #main #p8 { background-size: auto 93%, auto 93%; }
}

@media (min-width: 751px) {
    #main #ancnav ul li a:hover:before { opacity: 0; }
    #main #ancnav ul li a:hover:after { opacity: 1; }
    #main .snsnav ul li a:hover { opacity: 0.7; }
    #main #cfooter .nav ul li a:hover {
        background-color: #909090;
        color: #ffffff;
    }
    #main #cfooter .nav ul li a:hover:after { border-color: transparent transparent transparent #ffffff; }
    #index #main .box .btn a:hover {
        color: #333333;
        border-color: #e0e0e0;
        background-color: #e0e0e0;
    }
    #index #main .box .btn a:hover:after { border-color: transparent transparent transparent #666666; }
    #index #main #p1 .content .carrier a:hover {
        background-color: #b4b4b4;
        color: #ffffff;
    }
    #index #main #p1 .content .nav li a:hover {
        background-color: #666666;
        color: #ffffff;
    }
    #index #main #p1 .content .nav li a:hover:after { border-color: transparent transparent transparent #ffffff; }
    #index #main #p1 .content .nav li a:hover span:before { opacity: 0; }
    #index #main #p1 .content .nav li a:hover span:after { opacity: 1; }
}
@media (max-width: 750px) {
    #main{
        overflow: hidden;
    }
    #main #ancnav { display: none; }
    #main .box {
        height: auto;
        padding-top: 0;
        overflow: visible;
        letter-spacing: 0.05em;
        background: no-repeat center top;
        -webkit-background-size: 100% auto;
        background-size: 100% auto;
    }
    #main .box h2,
    #main .box h3,
    #main .box h4 {
        font-weight: 400;
    }
    #main .box h3 {
        padding: 0 4.6%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    #main .box .content,
    #main .box .content .inner {
        height: auto;
    }
    #main .box .content .inner .item {
        position: static;
    }
    #main .box .img:before,
    #main .box .img:after {
        content: '';
        display: block;
    }
    #main .snsnav {
        position: static;
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        padding: 0 10px 5.5%;
    }
    #main .box .snsnav .ttl { text-align: center; font-size: 1.1rem; }
    #main .snsnav ul { text-align: center; }
    #main .snsnav ul li:last-child { display: inline-block; }
    #main .snsnav ul li a.tw:before { background-image: url(../img/sp/sns_tw_g.png); }
    #main .snsnav ul li a.tw:after { background-image: url(../img/sp/sns_tw_w.png); }
    #main .snsnav ul li a.fb:before { background-image: url(../img/sp/sns_fb_g.png); }
    #main .snsnav ul li a.fb:after { background-image: url(../img/sp/sns_fb_w.png); }
    #main .snsnav ul li a.gp:before { background-image: url(../img/sp/sns_gp_g.png); }
    #main .snsnav ul li a.gp:after { background-image: url(../img/sp/sns_gp_w.png); }
    #main .snsnav ul li a.li:before { background-image: url(../img/sp/sns_li_g.png); }
    #main .snsnav ul li a.li:after { background-image: url(../img/sp/sns_li_w.png); }

    #main #cfooter .cfooterinner {
        position: static;
        height: auto;
        padding: 27px 0;
    }
    #main #cfooter .nav {
        position: static;
        height: auto;
        padding: 0 5px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    #main #cfooter .nav ul {
        height: auto;
    }
    #main #cfooter .nav ul li {
        width: 50%;
        height: auto;
        padding: 5px;
    }
	#main #cfooter .nav ul li a {
		font-size:1.2rem;
	}
    #main #cfooter .nav ul li a span {
        padding: 13px 0;
    }
	#main #cfooter .nav ul li:nth-of-type(7) a span {
		padding: 5px 0;
    	line-height: 1.4rem;
	}
    #main #cfooter .pdf {
        position: static;
        text-align: center;
        height: auto;
        padding: 5% 0;
    }
    #main #cfooter .pdf a img { width: 52.7%; max-width: none; }
    #main #cfooter .bn {
        position: static;
        height: auto;
        padding: 0 10px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    #main #cfooter .bn a {
        height: auto;
    }
    #main #cfooter .bn a img { width: 100%; }
	#main #cfooter .bn span {
		height: auto;
	}
	#main #cfooter .bn span img { width: 100%; }

    #main #cfooter .sp-bn{ display:block; text-align:center;}
    #main #cfooter .sp-bn img{ width:70%; height:auto; padding:10px;}

    #index #main .box {
        height: auto;
        background: no-repeat center top;
        -webkit-background-size: 100% auto;
        background-size: 100% auto;
        padding-top: 0;
    }
    #index #main #p1 {
        background: url(../img/sp/index_p1_bg.png) repeat-x left top;
        -webkit-background-size: 30px 306px;
        background-size: 30px 306px;
    }
    #index #main #p1 .inner .img {
        width: 100%;
        top: 0;
        height: auto;
    }
    #index #main #p1 .inner .wrap {
        position: static;
        height: auto;
        text-align: center;
    }
    #index #main #p1 .content h3 {
        font-size: 1.8rem;
        line-height: 1.5em;
    }
    #index #main #p1 .content h2 {
        width: 62.1%;
        margin: 0 auto;
        padding: 4% 0 6.25%;
    }
	#index #main #p1 .content .logos {
        width: 90%;
        margin: 0 auto;
        padding: 4% 0 6.25%;
    }
    #index #main #p1 .content .bn {
        position: relative;
        top: 0;
        padding: 0 10px 7%;
        letter-spacing: -1em;
        text-align: left;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    #index #main #p1 .content .bn .img {
        display: inline-block;
        width: 100%;
    }
    #index #main #p1 .content .bn .carrier {
        display: inline-block;
        width: 22.2%;
        min-width: 0;
        margin: 0 0 0 10px;
    }
    #index #main #p1 .content .carrier a {
        padding: 10px 7px;
    }
    #index #main #p1 .content .bn p {
        letter-spacing: 0;
		font-size: 1.3rem;
    }
    #index #main #p1 .content .nav {
        display: block;
        padding: 0 10px 5%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    #index #main #p1 .content .nav li {
        display: block;
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        padding: 0 0 10px;
    }
    #index #main #p1 .content .nav li:first-child,
    #index #main #p1 .content .nav li:last-child {
        padding: 0 0 10px;
    }
    #index #main #p1 .content .nav li a {
        font-size: 1.5rem;
    }
    #index #main #p1 .content .nav li.n1 a { padding-left: 67px; }
    #index #main #p1 .content .nav li.n2 a { padding-left: 63px; }
    #index #main #p1 .content .nav li.n3 a { padding-left: 63px; }
    #index #main #p1 .content .nav li.n4 a { padding-left: 63px; }
    #index #main #p1 .content .nav li.n1 a span { width: 67px; }
    #index #main #p1 .content .nav li.n2 a span { width: 63px; }
    #index #main #p1 .content .nav li.n3 a span { width: 63px; }
    #index #main #p1 .content .nav li.n4 a span { width: 63px; }
    #index #main #p1 .content .nav li.n1 a span:before { background-image: url(../img/sp/index_p1_nav2.png); }
    #index #main #p1 .content .nav li.n2 a span:before { background-image: url(../img/sp/index_p1_nav1.png); }
    #index #main #p1 .content .nav li.n3 a span:before { background-image: url(../img/sp/index_p1_nav4.png); }
    #index #main #p1 .content .nav li.n4 a span:before { background-image: url(../img/sp/index_p1_nav3.png); }

    #index #main #p3 h3,
    #index #main #p2 h3,
    #index #main #p5 h3,
    #index #main #p6 h3,
    #index #main #p7 h3,
    #index #main #p4 h3,
    #index #main #p8 h3 { padding-top: 7.8%; }
    #index #main .box h3 span {
        font-size: 3rem;
    }
    #index #main .box h4 {
        padding: 3.1% 4.6% 4.6%;
        font-size: 1.8rem;
    }
    #index #main .box p {
        padding: 0 4.6%;
        font-size: 1.3rem;
        line-height: 1.53em;
    }

    #index #main .box .btn {
        width: 100%;
        padding: 0 6.2% 10.1%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    #index #main .box .btn a {
        height: 40px;
        border-color: #909090;
        color: #666666;
    }
    #index #main #p5 .btn a,
    #index #main #p6 .btn a,
    #index #main #p7 .btn a,
    #index #main #p4 .btn a {
        border-color: #ffffff;
        color: #ffffff;
    }
    #index #main .box .btn a > span span {
        font-size: 1.4rem;
    }
    #index #main .box .btn a:after {
        border-color: transparent transparent transparent #909090;
    }
    #index #main #p5 .btn a:after,
    #index #main #p6 .btn a:after,
    #index #main #p7 .btn a:after,
    #index #main #p4 .btn a:after {
        border-color: transparent transparent transparent #ffffff;
    }

    #index #main #p3 { background-image: url(../img/sp/index_p2_bg.jpg); }
    #index #main #p3 .img:before,
    #index #main #p3 .img:after { padding-top: 9.3%; }
    #index #main #p3 .note {
        color: #666666;
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        padding: 0 6.2% 10.1%;
    }
    #index #main #p3 .note > div {
        font-size: 1.2rem;
        line-height: 1.25em;
        text-align: center;
    }

    #index #main #p2 { background-image: url(../img/sp/index_p3_bg.jpg); background-size: cover;}
    #index #main #p2 .inner { padding-left: 0; }
    #index #main #p2 h3 { padding-top: 135.6%; }
    #index #main #p2 p { padding-bottom: 10.9%; }

    #index #main #p5 {
        background-image: url(../img/sp/index_p4_bg.jpg);
        -webkit-background-size: cover;
        background-size: cover;
    }
    #index #main #p5 .img { width: 100%; }
    #index #main #p5 .img:before { padding-top: 10.9%; }
    #index #main #p5 .img:after { padding-top: 28.1%; }

    #index #main #p6 { background-image: url(../img/sp/index_p5_bg.jpg); background-color: #757476; }
    #index #main #p6 h4,
    #index #main #p6 p,
    #index #main #p6 .btn { padding-left: 4.6%; padding-right: 4.6%; }
    #index #main #p6 h3 {
        padding-left: 2%;
        padding-right: 2%;
        letter-spacing: 0;
    }
    #index #main #p6 h3,
    #index #main #p6 h4 { text-align: center; }
    #index #main #p6 p {
        padding-top: 4.6%;
        padding-bottom: 7.8%;
        text-align: center;
    }
    #index #main #p6 .img img { height: auto; width: 100%; }

    #index #main #p7 { background-image: none; background-color: #2b95ca; }
    #index #main #p7 .img:before { padding-top: 7%; }
    #index #main #p7 .img:after { padding-top: 9.3%; }

    #index #main #p4 { background-image: url(../img/sp/index_p7_bg.jpg); background-color: #121212; }
    #index #main #p4 .img {
        width: 87%;
    	margin: 0 auto;
    }
    #index #main #p4 .img:before { padding-top: 37.5%; }
    #index #main #p4 h3 { padding-top: 8.5%; }
    #index #main #p4 p { padding-bottom: 7.8%; }
    
    #index #main #p8 { background-image: url(../img/sp/index_p8_bg.jpg); background-color: #f3f3f3; }
    #index #main #p8 h3,
    #index #main #p8 h4,
    #index #main #p8 p,
    #index #main #p8 .btn { padding-left: 4.6%; padding-right: 4.6%; }
    #index #main #p8 h3,
    #index #main #p8 h4 { text-align: center; }
    #index #main #p8 .img { width: 100%; }
    #index #main #p8 .img:before { padding-top: 45.3%; }
    #index #main #p8 .img:after { padding-top: 18.7%; }
    #index #main #p8 p {
        padding-bottom: 6.25%;
        color: #333333;
        text-align: center;
    }

    #main.underPage > h1 { display: none; }
    #main.underPage .box .pageHader {
        position: static;
    }
    #main.underPage .box .pageHader h2 {
        padding: 6.2% 0 7.8%;
        font-weight: 400;
    }
    #main.underPage .box .pageHader h2 span {
        width: 87.5%;
    }
    #main.underPage .box h3 {
        padding: 6.25% 0 8.5%;
        font-size: 2.4rem;
        line-height: 1.41em;
        text-align: center;
    }
    #main.underPage .box h4,
    #main.underPage .box h5 {
        font-size: 1.6rem;
        line-height: 1.5em;
        padding: 0 0 1%;
    }
    #main.underPage .box p {
        font-size: 1.3rem;
        line-height: 1.53em;
    }
	#main.underPage .box .note .attention {
		font-size: 1.1rem;
	}
    #main.underPage #p1 h3 {
        padding: 0;
        font-size: 1.8rem;
        line-height: 1.5em;
    }
    #main.underPage .box .note {
        padding: 0 4.6% 6.2%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    #camera #main #p1 { background-image: url(../img/sp/camera_p1_bg.jpg); background-color: #485469; }
    #camera #main #p1 h3 { width: 100%; }
    #camera #main #p1 p {
        padding: 62% 4.6% 9.3%;
        text-align: left;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    #camera #main #p2 .img:after { padding-top: 12.5%; }
    #camera #main #p3 .note { padding-top: 9.3%; }
    #camera #main #p4 {
        background-image: url(../img/sp/camera_p4_bg.jpg);
        -webkit-background-size: cover;
        background-size: cover;
    }
    #camera #main #p4 h3 {
        padding-left: 41%;
        padding-bottom: 73.1%;
        text-align: left;
    }
    #camera #main #p5 {
        background-image: url(../img/sp/camera_p5_bg.jpg);
        -webkit-background-size: cover;
        background-size: cover;
    }
    #camera #main #p5 .img:before { padding-top: 8.4%; }
    #camera #main #p5 .img:after { padding-top: 8.4%; }
    #camera #main #p6 .img:after { padding-top: 9.3%; }
    #camera #main #p7 .note {
        text-align: center;
    }
    #camera #main #p7 .note h5 img { width: 37px; }
    #camera #main #p7 .note h4 {
        font-size: 1.8rem;
        line-height: 1.5em;
        padding: 0 0 3%;
    }
    #camera #main #p7 .img { width: 100%; }
    #camera #main #p7 .img:after { padding-top: 10.9%; }
    #camera #main #p7 .img img { width: 87.5%; }
    #camera #main #p8 {
        background: url(../img/sp/camera_p8_bg.jpg) no-repeat center bottom;
        -webkit-background-size: 100% auto;
        background-size: 100% auto;
    }
    #camera #main #p8 h4 {
        text-align: center;
        padding: 7.8% 0 2%;
    }
    #camera #main #p8 p {
        text-align: center;
        padding: 0 0 6.2%;
        line-height: 1.76em;
    }

    #battery #main #p1 { background-image: url(../img/sp/battery_p1_bg.jpg); background-color: #afbbc6; }
    #battery #main #p1 h2 { padding-top: 16.5%; }
    #battery #main #p1 h3 { padding-left: 35.9%; }
    #battery #main #p1 .note {
        padding-top: 53.1%;
        padding-bottom: 9.3%;
        color: #ffffff;
    }
    #battery #main #p1 .note h4 { color: #ffffff; }
    #battery #main #p2 {
        padding: 3% 0;
        background-color: #6bbbc7;
    }
    #battery #main #p2 .img:after { padding-top: 9.3%; }
    #battery #main #p2 .img img { width: 100%; }
    #battery #main #p3 {
        background-image: url(../img/sp/battery_p3_bg.jpg);
        -webkit-background-size: cover;
        background-size: cover;
    }
    #battery #main #p3 h3 { padding-left: 6.2%; }
    #battery #main #p3 .note {
        padding-top: 103%;
        color: #ffffff;
    }
    #battery #main #p3 .note h4 { color: #ffffff; }
	#battery #main #p4 { background-color:#c8c668; }
    #battery #main #p4 .img:after { padding-top: 11.8%; }
	#battery #main #p4 .img img { width:100%; }

    #toughness #main #p1 {
        background: url(../img/sp/toughness_p1_bg.jpg) no-repeat center;
        -webkit-background-size: cover;
        background-size: cover;
    }
    #toughness #main #p1 .pageHader h2 span {
        letter-spacing: 0;
        width: 91.5%;
    }
    #toughness #main #p1 h3 { padding-bottom: 110%; }
    #toughness #main #p2 { background-image: url(../img/sp/toughness_p2_bg.jpg); }
    #toughness #main #p2 .img {
        position: static;
        height: auto;
        background: url(../img/sp/toughness_p2_img.png) no-repeat center;
        -webkit-background-size: contain;
        background-size: contain;
        padding: 128.1% 0 0;
    }
    #toughness #main #p2 .txtwrap {
        padding: 0 4.6% 6.2%;
    }
    #toughness #main #p2 .txtwrap h4 {
        font-size: 1.8rem;
        line-height: 1.66em;
        padding: 0;
    }
    #toughness #main #p2 .txtwrap h5 {
        margin: 3.9% 0 2.3%;
        padding: 0;
        background: no-repeat right center;
        -webkit-background-size: auto 15px;
        background-size: auto 15px;
    }
    #toughness #main #p2 .txtwrap p {
        padding: 0 0 3.1%;
    }
    #toughness #main #p2 .txtwrap.t1 h5:nth-of-type(1) { background-image: url(../img/sp/toughness_p2_1_icon.png); }
    #toughness #main #p2 .txtwrap.t1 h5:nth-of-type(2) {
        margin-top: 7.8%;
    }
    #toughness #main #p2 .txtwrap.t1 {
        padding-top: 3.1%;
        padding-bottom: 8%;
    }
    #toughness #main #p2 .txtwrap.t1 .i {
        padding: 0 0 6.2%;
        text-align: center;
    }
    #toughness #main #p2 .txtwrap.t1 .i img { width: 79.8%; }
    #toughness #main #p2 .txtwrap.t1 .at {
        background-color: #f7f4ed;
        font-size: 1rem;
        line-height: 1.5em;
        padding: 12px;
        text-align: justify;
    }
    #toughness #main #p2 .txtwrap.t1 .cgg3 {
        background: url(../img/sp/toughness_p2_2_img1.png) no-repeat right top;
        -webkit-background-size: 80px auto;
        background-size: 80px auto;
    }
    #toughness #main #p2 .txtwrap.t1 .cgg3 p { width: 65.5%; }
    #toughness #main #p2 .txtwrap.t1 .cgg3 .i1 { width: 55.1%; }
    #toughness #main #p2 .txtwrap.t1 .cgg3 .i1 img { width: 100%; }
    #toughness #main #p3 { background-image: url(../img/sp/toughness_p3_bg.jpg); }
    #toughness #main #p3 .img {
        position: static;
        height: auto;
        background: url(../img/sp/toughness_p3_img.png) no-repeat center;
        -webkit-background-size: contain;
        background-size: contain;
        padding: 106.5% 0 0;
    }
    #toughness #main #p3 .txtwrap {
        padding: 0 4.6% 8%;
    }
    #toughness #main #p3 .txtwrap h4 {
        font-size: 1.8rem;
        line-height: 1.66em;
        padding: 3px 0 3px 75px;
        margin: 7.8% 0 0;
        background: url(../img/sp/toughness_p3_icon1.png) no-repeat left center;
        -webkit-background-size: 60px;
        background-size: 60px;
    }
    #toughness #main #p3 .txtwrap h5 {
        margin: 3.9% 0 2.3%;
        padding: 0;
        background: url(../img/sp/toughness_p3_icon2.png) no-repeat right center;
        -webkit-background-size: auto 15px;
        background-size: auto 15px;
    }
    #toughness #main #p3 .txtwrap p {
        padding: 0 0 3.1%;
    }
    #toughness #main #p3 .txtwrap p span {
        font-size: 1rem;
    }
    #toughness #main #p3 .txtwrap .at {
        background-color: #f7f4ed;
        font-size: 1rem;
        line-height: 1.5em;
        padding: 12px;
        text-align: justify;
    }
    #toughness #main #p4 .note {
        text-align: left;
        padding-top: 9.3%;
    }
    #toughness #main #p5 .img:before { padding-top: 10.9%; }
    #toughness #main #p5 .img:after { padding-top: 8.5%; }
    #toughness #main #p5 .img img { width: 100%; }
    #toughness #main #p5 .note {
        text-align: left;
    }
    #toughness #main #p5 .note span {
        display: block;
        font-size: 1rem;
        line-height: 1.5em;
        padding-top: 0.5em;
    }

    #text #main #p1 {
        background:
        url(../img/sp/text_p1_img.png) no-repeat center bottom,
        url(../img/sp/text_p1_bg.jpg) no-repeat center top;
        -webkit-background-size: 100% auto, 100% auto;
        background-size: 100% auto, 100% auto;
    }
    #text #main #p1 h3 {
        text-align: center;
        padding-bottom: 118.75%;
    }
    #text #main #p2 h3 { text-align: center; }
    #text #main #p2 .txtwrap {
        padding: 0 4.6% 4.6%;
    }
    #text #main #p2 .txtwrap h5 {
        margin: 0 0 2.3%;
        padding: 0;
        background: url(../img/sp/text_p2_icon.png) no-repeat right center;
        -webkit-background-size: auto 15px;
        background-size: auto 15px;
    }
    #text #main #p2 .img.i1 img,
    #text #main #p2 .img.i2 img,
    #text #main #p2 .img.i3 img{
        width: 100%;
    }
    #text #main #p2 .img.i2:before { padding-top: 8.5%; }
    #text #main #p2 .img.i2:after { padding-top: 11.8%; }
    #text #main #p2 .atok {
        width: 100%;
        font-size: 1.3rem;
        line-height: 1.53em;
        padding: 3.9% 4.6% 10.3%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    #text #main #p3 { background: url(../img/sp/text_p3_bg.jpg); }
    #text #main #p3 h3 { text-align: center; }
    #text #main #p3 h4 {
        margin: 0 4.6% 3.1%;
        -webkit-background-size: auto 15px;
        background-size: auto 15px;
    }
    #text #main #p3 .img img { width: 100%; }
    #text #main #p3 .txtwrap {
        padding: 0 4.6% 9.3%;
    }
    #text #main #p3 .txtwrap h5 {
        color: #8e734b;
        padding: 6.8% 0 2.3%;
    }
    #text #main #p4 { padding-bottom: 9.3%; }
    #text #main #p4 h3 { text-align: center; }
    #text #main #p4 .t {
        padding: 0 4.6%;
    }
    #text #main #p4 .t p {
        position: relative;
        padding: 0 0 0 1.5em;
    }
    #text #main #p4 .t p:before {
        content: '■';
        color: #66869d;
        position: absolute;
        top: 0;
        left: 0;
    }
    #text #main #p4 .img img { width: 100%; }
    #text #main #p4 .img:before { padding-top: 3.9%; }
    #text #main #p4 .img:after { padding-top: 4.6%; }

    #japan #main #p1 { background: none; background-color: #FFFFFF; }
    #japan #main #p1 h3 { text-align: center; }
    #japan #main #p1 .img:before { padding-top: 3.9%; }
    #japan #main #p1 .img:after { padding-top: 7.8%; }
    #japan #main #p1 .img img { width: 100%; }
    #japan #main #p1 .note.n2 > div {
        background: url(../img/sp/japan_p1_img2.png) no-repeat right top;
        -webkit-background-size: 62px auto;
        background-size: 62px auto;
    }
	#japan #main #p2 h3 { text-align: center; }
	#japan #main #p2 .img  {}
	#japan #main #p2 .img {
		top: 42.9%;
		left: 0;
		box-sizing: border-box;
		padding: 0 4.6% 0;
		text-align: right;
		position: absolute;
	}
	
    #japan #main #p3 { padding-bottom: 2%; }
    #japan #main #p3 h3 { text-align: center; }
    #japan #main #p3 .img:after { padding-top: 10.9%; }
    #japan #main #p3 .img img { width: 100%; }
    #japan #main #p3 .txtwrap {
        padding: 0 4.6% 6.3%;
    }
    #japan #main #p3 .txtwrap h5 {
        color: #ffffff;
        margin: 0 0 2.3%;
        background-color: #8e724b;
        width: 200px;
        height: 24px;
        padding: 0;
        border-radius: 12px;
        text-align: center;
        line-height: 24px;
        letter-spacing: -0.01em;
    }
    #japan #main #p3 .txtwrap h6 {
        color: #8e724b;
        padding: 1em 0 0;
        font-size: 1.2rem;
        line-height: 1.5em;
    }
    #japan #main #p3 .txtwrap ul {
        list-style: none;
        font-size: 1.3rem;
        line-height: 1.5em;
    }
    #japan #main #p3 .txtwrap ul li {
        position: relative;
        padding: 0 0 0 1.5em;
    }
    #japan #main #p3 .txtwrap ul li:before {
        content: '→';
        position: absolute;
        top: 0;
        left: 0;
    }
    #japan #main #p4 h3 { padding-top: 9.3%; }
    #japan #main #p4 .img:after { padding-top: 9.3%; }
    #japan #main #p4 .img img { width: 100%; }
	
    #japan #main #p5 {
        background-image: url(../img/sp/japan_p4_bg.jpg);
        background-color: #1d1f1f;
    }
    #japan #main #p5 h3 { padding-left: 4.6%; }
    #japan #main #p5 .note {
        width: 100%;
        padding-top: 83%;
        padding-bottom: 23.3%;
    }
	#japan #main #p5 .note.n1 { width:100%; }
	#japan #main #p5 h4 {
		font-size:2.4rem;
	}
	#japan #main #p5 .inner > h4 {
		text-align:center;
		font-size: 1.6rem;
    	padding-bottom: 7%;
	}
	#japan #main #p5 .img.i1,
	#japan #main #p5 .img.i2 {
		width:100%;
		padding-bottom:12%;
	}
    #japan #main #p6 { padding: 3% 0 5%; }
    #japan #main #p6 h3 {
        padding-left: 4.6%;
        padding-right: 4.6%;
        padding-bottom: 4.5%;
        font-size: 1.8rem;
        line-height: 1.66em;
    }
    #japan #main #p7 {
        background: url(../img/sp/japan_p7_bg.jpg) no-repeat center bottom;
        -webkit-background-size: 100% auto;
        background-size: 100% auto;
    }
    #japan #main #p7 h4 {
        padding: 0 4.6% 3.1%;
    }
    #japan #main #p7 .img:before { padding-top: 1.8%; }
    #japan #main #p7 .img:after { padding-top: 9.3%; }
    #japan #main #p7 .img img { width: 100%; }
    #japan #main #p8 {
        background: url(../img/sp/japan_p8_bg.jpg) no-repeat center bottom;
        -webkit-background-size: 100% auto;
        background-size: 100% auto;
    }
	#japan #main #p8 h3 { font-size: 2.4rem; }
    #japan #main #p8 .img:after { padding-top: 10.9%; }
    #japan #main #p8 .img img { width: 100%; }
    #japan #main #p9 {
        background: url(../img/sp/japan_p9_bg.jpg) no-repeat center bottom;
        -webkit-background-size: 100% auto;
        background-size: 100% auto;
    }
    #japan #main #p9 h3 {
        font-size: 2.4rem;
        text-align: center;
    }
    #japan #main #p9 .note.n1 { padding-bottom: 10.9%; }
    #japan #main #p9 .note.n2 { width: 100%; padding-bottom: 9.3%; }
    #japan #main #p9 .note.n2 div {
        padding: 0 0 0 70px;
        background: url(../img/sp/japan_p9_img2.png) no-repeat left top;
        -webkit-background-size: contain;
        background-size: contain;
    }
    #japan #main #p9 .img.i1:after { padding-top: 8.5%; }
    #japan #main #p9 .img.i1 img { width: 100%; }
    #download #main #p1 { background-image: url(../img/sp/download_p1_bg.jpg); background-color: #cbcbcc; }
    #download #main #p1 .pageHader h2 span {
        letter-spacing: 0;
    }
    #download #main #p1 h3 {
        padding: 0 4.6% 46%;
        text-align: left;
    }
    #download #main #p1 .img:after { padding-top: 10.9%; }
    #download #main #p1 .img img { width: 100%; }
    #download #main #p2 { padding: 2% 0; }
    #download #main #p2 .img:after { padding-top: 6.2%; }
    #download #main #p2 .img img { width: 100%; }
    #download #main #p3 { background-image: url(../img/sp/download_p3_bg.jpg); background-color: #1d1f1f; }
    #download #main #p3 h3 {
        padding-left: 46.8%;
        text-align: left;
    }
    #download #main #p3 .note { padding-top: 53.1%; }
    #download #main #p4 h3 { text-align: center; }
    #download #main #p4 .img img { width: 100%; }
    #download #main #p4 p {
        padding: 7.8% 4.6% 9.3%;
    }
    #download #main #p5 .img img { width: 100%; }
    #download #main #p5 p {
        padding: 7.8% 4.6% 9.3%;
        text-align: left;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    #design #main #p1 { background-image: url(../img/sp/design_p1_bg.jpg); }
    #design #main #p1 h3 {
        text-align: center;
        padding-bottom: 10.9%;
    }
    #design #main #p1 .img {
        height: auto;
        padding: 60.9% 0 10.9%;
        background: url(../img/sp/design_p1_img.png) no-repeat center top;
        -webkit-background-size: contain;
        background-size: contain;
    }
    #design #main #p2 {
        background: url(../img/sp/design_p2_bg1.png) no-repeat right bottom,
                    url(../img/sp/design_p2_bg2.png) no-repeat right top;
        -webkit-background-size: 100% auto, 100% auto;
        background-size: 100% auto, 100% auto;
    }
    #design #main #p2 h3 {
        padding-left: 4.6%;
    }
    #design #main #p2 p {
        padding: 0 4.6% 100%;
    }
    #design #main #p3 { background-image: url(../img/sp/design_p3_bg.jpg); }
    #design #main #p3 .img:before { padding-top: 2%; }
    #design #main #p3 .img img { width: 100%; }
    #design #main #p3 p {
        padding: 10.9% 4.6% 10.9%;
        text-align: left;
    }
    #design #main #p4 {
        background-image: url(../img/sp/design_p4_bg.jpg);
        padding-bottom: 3%;
    }
    #design #main #p4 h3 {
        padding-top: 103.1%;
        padding-left: 4.6%;
        padding-right: 4.6%;
    }
    #design #main #p5 {
        background-image: url(../img/sp/design_p5_bg.jpg);
        -webkit-background-size: cover;
        background-size: cover;
        padding: 98.4% 0 45%;
    }
    #design #main #p6 {
        background: none #a9b4bc;
        padding-bottom: 6.2%;
    }
    #design #main #p6 .note {
        padding: 4.6%;
    }
    #spec #main #p1 { border-bottom: 1px solid #d2d2d2; }
    #spec #main #p1 table th,
    #spec #main #p1 table td { font-size: 1.3rem; }
    #spec #main .snsnav { padding-top: 7.3%; }
    #spec #main #cfooter { height: auto; }
    #carrier #main #p1 { border-bottom: 1px solid #d2d2d2; }
    #carrier #main #p1 .list { width: 100%; }
    #carrier #main #p1 .list li {
        display: table;
        width: 100%;
    }
	#carrier #main #p1 .list li span div {
    	font-size: 1.6rem;
    	padding: 0 5%;
	}
    #carrier #main #p1 .list li a {
        display: table-cell;
        position: relative;
        height: 70px;
        vertical-align: middle;
    }
    #carrier #main #p1 .list li img { width: 102px; }
    #carrier #main #p1 .list li a > div {
        display: inline-block;
        letter-spacing: 0;
        vertical-align: middle;
    }
    #carrier #main #p1 .list li a > div:nth-of-type(1) {
		width:auto;
	    font-size: 1.6rem;
		padding-left:5%;
    }
    #carrier #main #p1 .list li a > div:nth-of-type(2),
    #carrier #main #p1 .list li a > div:nth-of-type(3){
        font-size: 1.3rem;
        line-height: 1.53em;
		padding-left:5%;
    }
    #carrier #main .snsnav { padding-top: 7.3%; }
    #carrier #main #cfooter { height: auto; }

	#info .date-link-list li .date {
		float: left;
		width: 74px;
	}
	#index #banner {
		padding: 20px 10px;
	}
	#index #banner a {
		width: 100%;
	}
}



#index #movie {
	border-top: 1px solid #d2d2d2;
	padding: 0;
}
@media (min-width: 751px){
	.vegas{ width:100%; margin:30px 0; overflow:hidden;}
	.vegas img { float:left; border:solid 1px #d2d2d2;}
	.vegas p{ margin-top:20px; margin-left:200px;font-size:110%; line-height:1.7;}
	.vegas p b{ font-weight:bolder;}
}
@media (max-width: 750px) {
	.vegas{ width:100%; margin:24px 0; padding-botom:24px; text-align:center;}
	.vegas img { width:182px; height:auto; border:solid 1px #d2d2d2;}
	.vegas p{ margin-top: 24px; text-align:left;}
	.vegas p b{ font-weight:bolder;}
	#index #movie {
	padding: 20px 10px;
}
}