@charset "utf-8";

/*----------------------------------------------------------------------------------------------------------------------

ヘッダー

----------------------------------------------------------------------------------------------------------------------*/
header { position: fixed; top: 0; left: 0; width: 100%; height: 112px; padding: 0; margin: 0 auto; background: url(../../common/image/header/header_bg.png) repeat-x 0 0; z-index: 9999; }
#header_inner { position: relative; width: 978px; padding: 0; margin: 0 auto; text-align: left; }
#header_inner h1 { position: absolute; top: 22px; left: 176px; line-height:1; }
#header_inner p#b_logo  { position: absolute; top: 17px; left: 0; line-height:1; }

header ul { position: absolute; top: 16px; right: 0; height: 25px; }
header ul li { float: left; margin-left: 15px; line-height:1; }
header ul li:last-child { margin-left: 25px; }

/*----------------------------------------------------------------------------------------------------------------------

フッター

----------------------------------------------------------------------------------------------------------------------*/
footer { width: 860px; padding: 0; margin: 80px auto 120px; text-align: center; }
footer ul li { float: left; margin: 0 25px; }

/*----------------------------------------------------------------------------------------------------------------------

ナビ

----------------------------------------------------------------------------------------------------------------------*/
nav { position: fixed; right: -166px; top: 50%; height: 310px; margin: -155px 0 0; background: url(../../common/image/navi/navi_bg.png) no-repeat 0 0; display: none; }
nav ul li { padding: 0 0 2px; }
nav p { position: absolute; top: 0; left: 0; z-index: 1000; }

/*----------------------------------------------------------------------------------------------------------------------

共通

----------------------------------------------------------------------------------------------------------------------*/
article { position: relative; width: 978px; padding: 0; margin: 0 auto; text-align: center; }
.opening p { margin: 30px 0 40px; font-size: 153.9%; line-height: 1.7; letter-spacing: 3px; }
.box_bg01 { background: url(../../common/image/general/box_bg01.png) no-repeat center center; }
.box_bg02 { background: url(../../common/image/general/box_bg02.png) no-repeat center center; }

/*----------------------------------------------------------------------------------------------------------------------

G-FREE TOP

----------------------------------------------------------------------------------------------------------------------*/
#p_logo { width: 100%; height: 492px; margin: 132px auto; }
#p_logo p { min-width: 978px; max-width: 100%; height: 398px; padding: 94px 0 0; text-align: center; background: url(../../common/image/header/gfree_logo_bg.png) no-repeat center center; display: none; }

/*----------------------------------------------------------------------------------------------------------------------

G-FREEについて

----------------------------------------------------------------------------------------------------------------------*/
#about p { margin: 45px 0; }
.about_box { width: 832px; padding: 0; margin: 0 auto 40px; text-align: center; }
.about_box div { padding: 0 0 22px; margin: 0 auto; background: url(../../common/image/about/box_bottom.png) no-repeat 0 bottom; }
.about_box div div { width: 742px; padding: 40px 45px 35px; margin: 0 auto; background: url(../../common/image/about/box_bg.png) repeat-y 0 0; }
.about_box dl dt { float: left; padding: 0 0 0 40px; }
.about_box dl dd { float: right; width: 460px; padding: 10px 20px 0 0; text-align: justify; text-justify: inter-ideograph; font-size: 130%; line-height: 1.6; }

.about_box ol { font-size: 130%; text-align: left; }
.about_box ol li { margin: 5px 0; }
.about_box ol:first-child { float: left; padding: 0; }
.about_box ol:last-child { float: right; padding: 0; }

.about_box p { margin: 0 !important; font-size: 138.5%; line-height: 2; }
.about_box p.button { width: 306px; margin: 40px auto 0 !important; }

.sailor_bg { background: url(../../common/image/about/sailor_bg.png) no-repeat center center; }

/*----------------------------------------------------------------------------------------------------------------------

商品特長

----------------------------------------------------------------------------------------------------------------------*/
#feature { min-width: 978px; max-width: 100%; margin-top: 80px; background: url(../../common/image/feature/astronaut.png) no-repeat 100% 600px; }
.feature_box { width: 832px; padding: 0; margin: 0 auto 40px; text-align: center; }
.feature_box div { padding: 0 0 22px; margin: 0 auto; background: url(../../common/image/feature/box_bottom.png) no-repeat center bottom; }
.feature_box div div { width: 742px; padding: 40px 45px 35px; margin: 0 auto; background: url(../../common/image/feature/box_bg.png) repeat-y 0 0; }

.feature_box p { float: none; }

.feature_box dl { text-align: justify; text-justify: inter-ideograph; }
.feature_box dl.t01 { clear: both; margin: 0 auto 45px; }
.feature_box dl.t01 dt { float: left; padding: 0 0 0 60px; }
.feature_box dl.t01 dd { float: right; width: 487px; padding: 15px 20px 0 0; font-size: 130%; line-height: 1.7; }

.feature_box dl.t02 { clear: both; margin: 0 auto 20px; }
.feature_box dl.t02 dt { float: right; padding: 0 20px 0 0; }
.feature_box dl.t02 dd { float: left; width: 363px; padding: 5px 0 0 20px; font-size: 130%; line-height: 1.7; }
.feature_box dl.t02 dd em { color: #E3007F; font-style: normal; }

.feature_box dl.t03 { float: left; width: 307px; margin: 0 auto; }
.feature_box dl.t03 dt { padding: 20px 0 40px 50px; text-align: left; }
.feature_box dl.t03 dd { padding: 0 0 0 10px; font-size: 130%; line-height: 2; }
.feature_box p.adjuster { float: right !important; padding: 0 10px 0 0; }

/*----------------------------------------------------------------------------------------------------------------------

検証結果

----------------------------------------------------------------------------------------------------------------------*/
#result { margin-top: 80px; }
#result h4 { margin: 0 0 40px; }
#result ul { width: 840px; margin: 0 auto 50px; text-align: center; }
#result ul li { float: left; width: 250px; padding: 0 15px 0; text-align: left; }
#result ul li dd { padding: 10px 0 0; font-size: 93%; }

.result_box .note { margin: 20px auto 50px; letter-spacing: 1px; }
.result_box div { padding: 0 0 22px; margin: 0 auto; background: url(../../common/image/feature/box_bottom.png) no-repeat center bottom; }
.result_box div div { width: 742px; padding: 40px 45px 35px; margin: 0 auto; background: url(../../common/image/feature/box_bg.png) repeat-y center 0; }

.expert dl { margin: 0 auto 35px; width: 640px; }
.expert dl dt { float: left; padding: 0; }
.expert dl dd { float: right; width: 470px; padding: 0; }
.expert dl dd dl { clear: both; width: 470px; padding: 0; margin: 0; text-align: left;  line-height: 1.7; }
.expert dl dd dl dt { padding: 5px 0 9px; font-size: 153.9%; line-height: 1; }
.expert dl dd dl dt span { font-size: 70%; }
.expert dl dd dl dd { padding: 9px 0 0; font-size: 93%; border-top: 1px solid #A8A9A9; }
.expert p { clear: both; margin: 0 auto; width: 640px; text-align: justify; text-justify: inter-ideograph; font-size: 123.1%; line-height: 1.7; }

/*----------------------------------------------------------------------------------------------------------------------

商品ラインナップ

----------------------------------------------------------------------------------------------------------------------*/
#lineup { margin-top: 80px; }
#lineup h4 { margin: 0; }
#lineup .opening p { padding: 30px 0 40px; }
#lineup p { padding: 40px 0 0; }
#lineup p.price { width: 712px; padding: 0; text-align: right; }

.lineup_box div { padding: 0 0 22px; margin: 0 auto; background: url(../../common/image/feature/box_bottom.png) no-repeat center bottom; }
.lineup_box div div { width: 742px; padding: 0 45px 35px; margin: 0 auto; background: url(../../common/image/feature/box_bg.png) repeat-y center 0; }

.lineup_box table { margin: 15px auto 0; width: 700px; border-collapse: collapse; border-spacing: 0; border: 1px #E6E6E6 solid; }
.lineup_box table th { width: 220px; padding: 8px 0; color: #E3007F; text-align: center; vertical-align: middle; border-spacing: 0; border: 1px #E6E6E6 solid; }
.lineup_box table td { padding: 6px 0; color: #E6E6E6; text-align: center; vertical-align: middle; border-spacing: 0; border: 1px #E6E6E6 solid; }
.lineup_box table td.color { text-align: left; padding: 0 0 0 20px; }
.lineup_box table td.color span { display: inline-block; width: 95px;  }
.lineup_box table.spec { margin: 40px auto 0; }
.lineup_box table.spec th { width: 150px; padding: 8px 0 8px 15px; text-align: left !important; }
.lineup_box table.spec td { padding: 6px 0 6px 15px; text-align: left !important; }