@import url(https://fonts.googleapis.com/css?family=Roboto:900,700,500,400,300,100);
/* 蝓ｺ譛ｬ繝ｬ繧､繧｢繧ｦ繝茨ｼ九ヵ繧ｩ繝ｳ繝域欠螳� */
.container {
position: relative;
/*font-family: 'Noto Sans Japanese', sans-serif;*/
font-family: 'Noto Sans JP', sans-serif;
text-align: center;
overflow-x: hidden;
}
.container>.section:first-child {
margin-top: 0;
}
.container>.section {
margin-top: 6em;
}
.container .section_high {
margin-top: 12em;
}
.container .section_mid {
margin-top: 9em;
}
.container .section_low {
margin-top: 3em;
}
.container a {
color: #2e2e2e;
outline: none;
}
.container .bk {
color: #2e2e2e;
}
.container .wh {
color: #fff;
}
.container h1 {
margin: 0;
padding: 0;
}
.container h2.main_catch,
.container h2.h2_1,
.container h2.h2_2 {
font-size: 2.9rem;
/* font-size: 46px;*/
font-weight: 200;
line-height: 1.5;
}
.container h2.main_catch { margin-top: 2em;}
.container h2.h2_1 { margin-top: 4em;}
.container h2.h2_2 { margin-top: 0;}
.container h2 {
margin: 0 0 0.5em 0;
padding: 0;
font-size: 1.62rem;
/* font-size: 26px;*/
font-weight: 400;
line-height: 1;
}
.container h3 {
margin-top: 3em;
margin-bottom: 0.2em;
padding: 0;
font-size: 2rem;
/* font-size: 40px;*/
font-weight: 300;
line-height: 1.5;
}
.container .table h3,
.container div div h3 {
margin-top: 0;
}
@media screen and (min-width: 641px) {
.container h3 sup {
font-size: 0.6em;
}
}
.container h4 {
font-size: 2rem;
font-weight: 300;
line-height: 1.5;
}
.container p {
margin: 0 auto;
padding: 0;
width: 100%;
max-width: 960px;
font-size: 1.06rem;
/* font-size: 18px;*/
font-weight: 300;
line-height: 2;
text-align: left;
}
.container ul,
.container li {
margin: 0;
}
.ruby {
display: block;
font-size: 0.4em;
color: #717071;
line-height: 1;
letter-spacing: 2px;
}
.container .cap {
margin-top: 1em;
font-size: 0.66rem;
line-height: 1.5;
}
.container .imagecaption {
width: 90%;
max-width: 960px;
text-align: right;
font-size: 0.66rem;
}
.int1 {
padding-left: 1em !important;
text-indent: -1em !important;
}
.int15 {
padding-left: 1.5em !important;
text-indent: -1.5em !important;
}
a sup {
border-bottom: 1px solid #999;
}
.container img {
max-width: 100%;
vertical-align: bottom;
}
.trigger {
height: 1px;
}
/* 繝ｭ繝ｼ繧ｫ繝ｫ繝翫ン繧ｲ繝ｼ繧ｷ繝ｧ繝ｳ*/
.local_navigation {
width: 100%;
background: rgba(255,255,255,0.9);
filter:progid:DXImageTransform.Microsoft.Gradient(StartColorStr=#e9ffffff,EndColorStr=#e9ffffff);/*IE8逕ｨ*/
text-aign: center;
}
.local_navigation ul {
margin: 0 auto;
display: table;
}
.local_navigation ul li {
display: table-cell;
height: 100%;
text-align:center;
vertical-align: middle;
font-size: 0.8rem;
}
.local_navigation ul li a.current {
color: #ff6600;
}
.local_navigation a {
color: #2e2e2e;
text-decoration: none;
outline: none;
}
@media screen and (min-width: 641px) {
.local_navigation {
position: absolute;
top: 0;
left: 0;
height: 56px;
z-index: 10;
}
.local_navigation ul {
width: 960px;
height: 100%;
}
.local_navigation ul li {
padding: 0 10px;
}
.local_navigation ul li:first-child {
text-align: left;
}
.local_navigation ul li a {
transition-property: color, opacity;
transition-duration: 0.15s;
transition-timing-function: ease-in-out;
}
.local_navigation ul li a:hover {
color: #ff6800;
transition-timing-function: ease-in-out;
}
.local_navigation.fixed {
position: fixed !important;
top: 0 !important;
z-index: 1000;
}
}
@media screen and (max-width: 640px) {
.local_navigation {
position: absolute;
background: #fff;
box-shadow:rgba(0, 0, 0, 0.08) 0px 2px 8px 2px;
}
.local_navigation p {
padding: 16px 10px 12px 12px;
width: 100% !important;
text-align: left;
background: #e6e6e6;
}
.local_navigation ul {
width: 100%;
height: 100%;
border-bottom: 1px solid #e6e6e6;
border-collapse: collapse;
table-layout: fixed;
}
.local_navigation ul li {
padding: 0.9em 0;
font-size: 0.7rem;
}
.local_navigation ul li a {
display: inline-block;
width: 100%;
border-left: 1px solid #e6e6e6;
}
.local_navigation ul li:first-child a {
border-left: none;
}
.local_navigation.fixed {
position: fixed !important;
top: 0 !important;
z-index: 10000;
}
}
/* 繝代Φ縺上★繝ｪ繧ｹ繝� */
@media screen and (min-width: 641px) {
.breadcrumb-nav {
position: absolute;
top: 56px;
left: 0;
width: 100%;
}
.breadcrumb-nav p {
margin: 0 auto;
padding: 15px 10px;
width: 940px;
text-align: left;
color: #2f2f2f;
font-size: 0.7rem;
font-weight: 400;
}
.breadcrumb-nav p a {
color: #2f2f2f;
text-decoration: none;
transition-property: color;
transition-duration: 0.15s;
transition-timing-function: ease-in-out;
}
.breadcrumb-nav p.wh a {
color: #fff;
font-weight: 200;
}
.breadcrumb-nav p a:hover {
color: #ff6800;
}
}
@media screen and (max-width: 640px) {
.breadcrumb-nav {
}
.breadcrumb-nav p {
padding: 1em;
text-align: left;
color: #2f2f2f;
font-size: 0.5rem;
line-height: 1.4;
}
.breadcrumb-nav p a {
color: #2f2f2f;
text-decoration: underline;
}
}
/* 繝懊ち繝ｳ隕∫ｴ� */
.container .btn,
.container .btn_blank {
display: inline-block;
margin-top: 1.5em;
margin-bottom: 1.5em;
padding: 10px 10px 10px 14px;
border-width: 2px;
border-style: solid;
border-radius: 4px;
text-decoration: none;
line-height: 1em;
font-size: 0.9rem;
/* font-size: 14px;*/
}
.container .bk .btn,
.container .bk .btn_blank {
color: #2e2e2e;
border-color: #2e2e2e;
}
.container .wh .btn,
.container .wh .btn_blank {
color: #fff;
border-color: #fff;
}
.container .btn span:after,
.container .btn_blank span:after {
margin-left: 10px;
}
.container .bk .btn span:after {
content: url(../images/icon_arrow_bk.png);
}
.container .wh .btn span:after {
content: url(../images/icon_arrow_wh.png);
}
.container .btn.wide,
.container .btn_blank.wide{
padding-left: 54px;
}
.container .btn.wide span:after,
.container .btn_blank.wide span:after{
margin-left: 50px;
}
.anchor_blank span:after,
.btn_blank span:after {
content: url(../images/icon_newwindow.png);
margin: 0 4px 0 2px;
}
.anchor_blank {
text-decoration: underline;
}
/* 繝ｭ繝ｼ繝ｫ繧ｪ繝ｼ繝舌�髢｢菫� */
.container a:hover img {
background: transparent;
opacity: 1;
}
@media screen and (min-width: 641px) {
a.fade:hover {
opacity: 0.5;
}
a.fadeGray:hover {
background-color: #616161 !important;
border-color: #616161 !important;
color: #fff !important;
}
a.fadeWhite:hover {
background-color: #fff !important;
border-color: #fff !important;
color: #2e2e2e !important;
}
.container .bk a.btn.fadeGray:hover span:after {
content: url(../images/icon_arrow_wh.png);
}
.container .wh a.btn.fadeWhite:hover span:after {
content: url(../images/icon_arrow_bk.png);
}
a,
a.fade,
a.fadeGray,
a.fadeWhite,
a img {
transition-property: background-color, border-color, color, opacity;
transition-duration: 0s;
transition-timing-function: ease-in-out;
}
a.fade_t:hover{
opacity: 0.7;
}
a.fade_t {
transition-property: background-color, border-color, color, opacity;
transition-duration: 0.3s;
transition-timing-function: ease-in-out;
}
}
/* 逕ｻ蜒丞�繧頑崛縺茨ｼ医ヵ繧ｧ繝ｼ繝会ｼ� */
.slide_fade {
display: inline-block;
position: relative;
overflow: hidden;
}
.slide_fade .slide_target {
display: inline-block;
opacity: 0;
position: absolute;
top: 0;
left: 100%;
width: 100%;
}
.slide_fade .slide_target:first-child {
opacity: 1;
position: relative;
top: 0;
left: 0;
}
/* 繧ｫ繝ｩ繝ｼ繝舌Μ繧ｨ繝ｼ繧ｷ繝ｧ繝ｳ蛻�崛繝懊ち繝ｳ */
.colorchip li {
display: inline-block;
}
.colorchip li a {
display: inline-block;
margin: 0 3px;
width: 7em;
/* margin: 4px;*/
border-top: 8px solid #fff;
text-align: center;
font-size: 0.66em;
text-decoration: none;
}
.colorchip li a.blue { border-color: #051fb9;}
.colorchip li a.pink { border-color: #ff3aaa;}
.colorchip li a.black { border-color: #282a2a;}
/* 讖溯�隱ｬ譏� */
.function {
display: none;
padding-bottom: 20px;
}
.function>div {
padding-bottom: 30px;
}
@media screen and (max-width: 640px) {
.function>div {
padding: 30px 0;
}
}
.open_trigger {
display: inline-block;
width: 30px;
height: 30px;
background: url(../images/icon_aroow_under.png) no-repeat center center;
cursor: pointer;
-moz-transition: -moz-transform 0.5s linear;
-webkit-transition: -webkit-transform 0.5s linear;
-o-transition: -o-transform 0.5s linear;
-ms-transition: -ms-transform 0.5s linear;
transition: transform 0.5s linear;
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
-ms-transform: rotate(0deg);
transform: rotate(0deg);
}
.open_trigger.active {
/* background: url(/products/k-tai_d_common_v3/images/icon_minus.png) no-repeat center center;*/
-moz-transition: -moz-transform 0.5s linear;
-webkit-transition: -webkit-transform 0.5s linear;
-o-transition: -o-transform 0.5s linear;
-ms-transition: -ms-transform 0.5s linear;
transition: transform 0.5s linear;
-moz-transform: rotate(-180deg);
-webkit-transform: rotate(-180deg);
-o-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
/* 100%閭梧勹 */
.container .cover {
width: 100% !important;
max-width: 100% !important;
}
/* 繧ｭ繝ｼ繝薙ず繝･繧｢繝ｫ */
.container .kv {
position: relative;
width: 100%;
text-align: center;
}
.container .kv .attention {
display: block;
position: absolute;
left: 50%;
margin-left: -480px;
bottom: 60px;
z-index: 1;
text-align: center !important;
opacity: 0;
}
@media screen and (max-width: 640px) {
.kv > img.cover {margin-top: 125px;}
.kv { min-height: 125px; }
}
/* 繝昴ず繧ｷ繝ｧ繝ｳ謖�ｮ� */
.container .section,
.container .section_mid,
.container .section_low,
.container .section_con {
position: relative;
}
/* 荳ｭ繝ｻ荳� */
.container .pos_ct {
position: absolute;
top: 8%;
left: 0;
width: 100%;
}
/* 蜿ｳ��3蛻�牡�峨�荳ｭ */
.container .pos_rm {
position: absolute;
top: 50%;
margin-top: -180px;
left: 33%;
width: 67%;
}
/* 蜿ｳ��2蛻�牡�峨�荳ｭ */
.container .pos_r2m {
position: absolute;
top: 50%;
margin-top: -180px;
left: 45%;
width: 55%;
max-width: 530px;
}
/* 蜿ｳ��2蛻�牡�峨�荳� */
.container .pos_r2b {
position: absolute;
top: 50%;
left: 45%;
width: 55%;
max-width: 570px;
}
/* 荳ｭ繝ｻ荳ｭ */
.container .pos_cm {
position: absolute;
top: 50%;
margin-top: -180px;
left: 0;
width: 100%;
}
/* 蟾ｦ繝ｻ荳ｭ */
.container .pos_lm {
position: absolute;
top: 50%;
margin-top: -180px;
right: 43%;
width: 47%;
padding-left: 10%;
}
/* 蜀咏悄縺ｪ縺� */
@media screen and (min-width: 641px) {
.container .plane {
/* padding: 4em 0 4.5em;*/
}
}
@media screen and (max-width: 640px) {
.container .plane {
/* padding: 2em 0 2.5em;*/
}
}
/* 繧ｳ繝斐�蝮�ｭ峨�繝�け繧ｹ */
.container .justbox {
margin-left: auto;
margin-right: auto;
width: 90%;
max-width: 940px;
text-align: left;
}
@media screen and (min-width: 641px) {
.container .pos_lm .justbox {
margin-left: 0;
width: 90%;
max-width: 940px;
text-align: left;
}
}
/* 讓ｪ荳ｦ縺ｳ */
.container .inline-block {
display: inline-block !important;
width: auto;
}
/* 讓ｪ荳ｦ縺ｳ */
@media screen and (min-width: 641px) {
.container .parallel {
margin-left: auto;
margin-right: auto;
width: 960px;
}
.container .parallel>div,
.container .parallel>ul {
display: inline-block;
}
.container .parallel ._left {
position: relative;
width: 470px;
padding-right: 30px;
}
.container .parallel ._right {
position: relative;
width: 470px;
height: 100%;
padding-left: 10px;
}
}
/* 邂ｱ */
.box {
position: relative;
}
/* 譁�ｫ�荳ｭ縺ｮ逕ｻ蜒擾ｼ郁ｨ伜捷縺ｪ縺ｩ�峨ユ繧ｭ繧ｹ繝医Λ繧､繝ｳ繧呈純縺医ｋ */
.img-in-txt {
margin-top: -0.2em;
height: 1em;
vertical-align: middle !important;
}
/* 蜑榊ｾ後�繧ｳ繝ｳ繝�Φ繝�リ繝� */
.prev_next_link {
display: table;
table-layout: fixed;
width: 100%;
padding: 2.5em 0;
}
.prev_next_link p {
display: table-cell;
width: 50%;
padding: 20px 0;
}
.prev_next_link p.prev {
text-align: right;
}
.prev_next_link p.prev a {
display: inline-block;
border-right: 1px solid #e5e5e5;
padding: 0 30px;
text-decoration: none;
}
.prev_next_link p.prev a:before {
content: url(../images/icon_page_prev.png);
margin-right: 2em;
}
.prev_next_link p.next {
text-align: left;
}
.prev_next_link p.next a {
display: inline-block;
padding: 0 30px;
text-decoration: none;
}
.prev_next_link p.next a:after {
content: url(../images/icon_page_next.png);
margin-left: 2em;
}
@media screen and (max-width: 640px) {
.prev_next_link {
padding: 0.5em 0;
}
}
/* 邵ｦ菴咲ｽｮ謠�∴ */
@media screen and (min-width: 641px) {
.tbl {
display: table;
margin-top: 2em;
margin-left: auto;
margin-right: auto;
}
.container .tbl>div,
.container .tbl>p {
/*position: relative;*/
display: table-cell;
vertical-align: middle;
}
.container .tbl .txt {
width: auto;
}
}
/* 繝��繝悶Ν2蛻�牡 */
.table {
display: table;
table-layout: fixed;
border: none;
margin: 0 auto;
}
.table .tr {
display: table-row;
}
.table .td {
display: table-cell;
}
.table .td_vm {
display: table-cell;
vertical-align: middle;
}
.table .td_vb {
display: table-cell;
text-align: center;
vertical-align: bottom;
}
@media screen and (max-width: 640px) {
.table .td_vm {
display: block;
text-align: center;
}
}
/* 讓ｪ荳ｦ縺ｳ蝮�ｭ蛾�鄂ｮ�亥ｷｦ蜿ｳ蛹ｺ蛻�ｊ邱壻ｻ倥″�� */
.table-ul,
.table-ul-line,
.table-ul-text {
display: table;
table-layout: fixed;
text-align: center;
width: 100%;
border-collapse: collapse;
}
.table-ul li,
.table-ul-line li,
.table-ul-text li {
display: table-cell;
vertical-align: middle;
}
.table-ul-line li,
.table-ul-text li {
border-left: 1px solid #e6e6e6;
border-right: 1px solid #e6e6e6;
}
.table-ul-text li a {
display: inline-block;
padding: 0.8em 0;
font-size: 1.1em;
font-weight: 500;
text-decoration: none;
}
.slide_fade li.active img {
opacity: 0.6;
}
.table-ul-text li.active a {
color: #ff6600;
}
/* 蟶ｯ繝悶Ο繝�け */
.container .belt {
padding: 30px 0;
background-color: #f8f8f8;
}
.container .belt .tbl {
margin: 0 auto;
}
/* 繧ｹ繝ｩ繧､繝繝ｼ */
@media screen and (min-width: 641px) {
.flexslider {
margin: 0 auto;
}
.slide_nav a {
position: absolute;
top:50%;
margin-top: -24px;
width: 2%;
max-width: 26px;
height: 48px;
overflow: hidden;
white-space: nowrap;
text-indent: 100%;
}
.slide_nav a.flex-prev {
left: -36px;
background: url(../images/btn_slide_left.png) no-repeat;
}
.slide_nav a.flex-next {
right: -36px;
background: url(../images/btn_slide_right.png) no-repeat;
background-size: contain;
}
}
@media screen and (max-width: 640px) {
.slide_nav {
padding-top: 2.5em;
}
.flex-control-paging li a {
width: 8px !important;
height: 8px !important;
}
.flex-prev,
.flex-next {
display: none;
}
.before,
.after {
position: relative;
}
}
/*IE8蟇ｾ蠢�*/
html>/**/body .slide_nav {
display /*\**/: none\9;
}
:root .slide_nav {
display: block\0/;
}
html>/**/body .slides li {
margin /*\**/: 10px\9;
}
:root .slides li {
margin: 0\0/;
}
/*YouTube蜍慕判*/
.movie-bg {
background-color: #000;
position: fixed;
top: 0;
left: 0;
opacity: 0;
z-index: 1;
}
.movie-bg iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.movie-bg a {
display: block;
position: absolute;
top: 20px;
right: 20px;
padding: 4px 12px;
border: 1px solid #fff;
border-radius: 2px;
color: #fff;
font-size: 0.8rem;
font-weight: 200;
line-height: 1;
letter-spacing: 1px;
text-decoration: none;
transition: all .2s;
}
/* 蟷�欠螳� */
@media screen and (min-width: 641px) {
.container .w10p {
width: 10%;
margin-left: auto;
margin-right: auto;
}
.container .w20p {
width: 20%;
margin-left: auto;
margin-right: auto;
}
.container .w30p {
width: 30%;
margin-left: auto;
margin-right: auto;
}
.container .w40p {
width: 40%;
margin-left: auto;
margin-right: auto;
}
.container .w50p {
width: 50%;
margin-left: auto;
margin-right: auto;
}
.container .w60p {
width: 60%;
margin-left: auto;
margin-right: auto;
}
.container .w70p {
width: 70%;
margin-left: auto;
margin-right: auto;
}
.container .w80p {
width: 80%;
margin-left: auto;
margin-right: auto;
}
.container .w90p {
width: 90% !important;
margin-left: auto;
margin-right: auto;
}
.container .w1080 {
position: relative;
width: 100%;
max-width: 1080px;
margin-left: auto;
margin-right: auto;
}
.container .w960 {
position: relative;
width: 100%;
max-width: 960px;
margin-left: auto;
margin-right: auto;
}
.container .w800 {
position: relative;
width:800px;
margin-left: auto;
margin-right: auto;
}
.container .w700 {
position: relative;
width:700px;
margin-left: auto;
margin-right: auto;
}
.container .w600 {
position: relative;
width:600px;
margin-left: auto;
margin-right: auto;
}
.container .w500 {
position: relative;
width:500px;
margin-left: auto;
margin-right: auto;
}
}
.auto_width {
margin-left: auto !important;
margin-right: auto !important;
}
.w-max {
max-width: 100% !important;
}
/* 蛹ｺ蛻�ｊ邱� */
.container hr.pale {
border: 0;
border-bottom: 1px solid #ececec;
}
/* 陦碁俣險ｭ螳� */
@media screen and (min-width: 641px) {
.mt-pc-0em { margin-top: 0 !important;}
.mt-pc-1em { margin-top: 1em !important;}
.mt-pc-2em { margin-top: 2em !important;}
.mt-pc-3em { margin-top: 3em !important;}
.mt-pc-4em { margin-top: 4em !important;}
.mt-pc-5em { margin-top: 5em !important;}
.mt-1h-em { margin-top: 1.5em !important;}
.mt--10em {
margin-top: 10em !important;
}
.pr--2em {
padding-right: 2em;
}
.text--left { text-align: left !important;}
.text--center { text-align: center !important;}
.text--right { text-align: right !important;}
.topic-path { margin-top: 0;}
}
.ml--05em {
margin-left: .5em !important;
}
.va--top {
vertical-align: top !important;
}
.va--middle {
vertical-align: middle !important;
}
.float--left {
float: left;
margin-right: 2em;
}
.float--right {
float: right;
margin-left: 2em;
}
/* 蜃ｺ縺怜�縺� */
@media screen and (min-width: 641px) {
.forSP { display: none;}
}
@media screen and (max-width: 640px) {
.forPC { display: none !important;}
.forSP { display: block !important;}
}
.forIE8 {
display: none;
}
html>/**/body .forIE8 {
display /*\**/: block\9;
}
:root .forIE8 {
display: none\0/;
}
html>/**/body .forIE8no {
display /*\**/: none\9;
}
:root .forIE8no {
display: block\0/;
}
:root .forIE9no {
display: none\0/;
}
@media screen and (max-width: 640px) {
html,
body {
position: relative;
width: 100%;
overflow-x: hidden;
}
img {
max-width: 100%;
}
.container .inner {
text-align: center;
}
.container .inner img {
max-width: 88%;
}
.container .inner.sp60 img {max-width: 60% !important;}
.container .inner.sp70 img {max-width: 70% !important;}
.container .inner.sp80 img {max-width: 80% !important;}
.mt-sp-0em { margin-top: 0 !important;}
.mt-sp-1em { margin-top: 1em !important;}
.mt-sp-2em { margin-top: 2em !important;}
.mt-sp-3em { margin-top: 3em !important;}
.mt-sp-4em { margin-top: 4em !important;}
.mt-sp-5em { margin-top: 5em !important;}
.mt-sp-m1em { margin-top: -1em !important;}
.mt-sp-m2em { margin-top: -2em !important;}
.mt-sp-73px { margin-top:73px !important;}
.mt-sp-37px { margin-top:37px !important;}
.text-sp-center { text-align: center !important;}
.container>.section {
margin-top: 3em;
overflow-x: hidden;
}
.container>.section_mid {
margin-top: 6em;
}
.container>.section_low {
margin-top: 2em;
}
.container h2.main_catch {
margin-top: 2em;
font-size: 1.6rem;
}
.container h2.h2_1 {
margin-top: 2em;
font-size: 1.6rem;
}
.container h2.h2_2 {
margin-top: 0;
font-size: 1.6rem;
}
.container h2 {
font-size: 1rem;
font-weight: 300;
max-width: 94%;
margin-left: auto;
margin-right: auto;
}
.container h3 {
margin: 0.6em auto;
font-size: 1.15rem;
font-weight: 200;
max-width: 94%;
}
.container h4 {
font-size: 1.15rem;
font-weight: 300;
max-width: 94%;
}
.container h5 {
margin: 0.6em auto 0.2em;
max-width: 94%;
}
.container p {
font-size: 0.72rem;
width: 94%;
margin-left: auto;
margin-right: auto;
}
.container .btn,
.container .btn_blank {
margin-top: 2.5em;
padding: 10px 10px 10px 64px;
font-size: 0.66rem;
}
.container .btn span:after,
.container .btn_blank span:after {
margin-left: 40px;
}
.container .wh {
color: #2e2e2e;
}
.container .wh .btn,
.container .wh .btn_blank {
color: #2e2e2e;
border-color: #2e2e2e;
}
.container .wh .btn span:after {
content: url(../images/icon_arrow_bk.png);
}
.container .wh .btn_blank span:after {
content: url(../images/icon_newwindow.png) !important;
}
.container .bk .btn_blank span:after {
content: url(../images/icon_newwindow.png) !important;
}
.container .pos_ct,
.container .pos_rm,
.container .pos_r2m,
.container .pos_r2b,
.container .pos_cm,
.container .pos_lm {
position: relative;
top: 0;
margin: 0 auto;
margin-top: 3em;
left: 0;
right: 0;
padding: 0;
width: 92%;
text-align: center;
}
.container .parallel {
width: 100%;
}
.container .parallel>div,
.container .parallel>ul {
display: block;
text-align: center;
}
.container .parallel img {
margin: 1em auto;
}
.container .fullmovie_ctr {
margin-bottom: 5em;
}
.container .forSP .fullmovie_ctr {
margin-bottom: 0;
}
.movie_player {
margin-top: 1.5em;
width: 100%;
}
.container .w_sp20 {
width: 20% !important;
margin-left: auto;
margin-right: auto;
}
.container .w_sp30 {
width: 30% !important;
margin-left: auto;
margin-right: auto;
}
.container .w_sp40 {
width: 40% !important;
margin-left: auto;
margin-right: auto;
}
.container .w_sp50 {
width: 50% !important;
margin-left: auto;
margin-right: auto;
}
.container .w_sp60 {
width: 60% !important;
margin-left: auto;
margin-right: auto;
}
.container .w_sp70 {
width: 70% !important;
margin-left: auto;
margin-right: auto;
}
.container .w_sp80 {
width: 80%;
margin-left: auto;
margin-right: auto;
}
.container .w_sp90 {
width: 90%;
margin: 0 auto;
}
/*--*/
.container .mw_sp20 {
max-width: 20% !important;
}
.container .mw_sp30 {
max-width: 30% !important;
}
.container .mw_sp40 {
max-width: 40% !important;
}
.container .mw_sp50 {
max-width: 50% !important;
}
.container .mw_sp60 {
max-width: 60% !important;
}
.container .mw_sp70 {
max-width: 70% !important;
}
.container .mw_sp80 {
max-width: 80% !important;
}
.container .mw_sp90 {
max-width: 90% !important;
}
.container .mw_sp94 {
max-width: 94% !important;
}
/*
.text--right {
text-align: center !important;
}
*/
.tbl {
/* margin-top: 2em;*/
}
.tbl .img {
margin-top: 2em;
}
.pb_sp1em {
padding-bottom: 1.5em;
}
.pb_sp3em {
padding-bottom: 3.5em;
}
.sp-block {
float: none;
display: block;
margin: 0 auto 1em;
}
}
.spec {
margin: 200px auto;
width: 960px;
text-align: left;
}
.spec h2 {
font-size: 2.5rem;
/* font-size: 40px;*/
font-weight: 300;
line-height: 1;
}
.spec h3 {
font-size: 1.5rem;
/* font-size: 24px;*/
font-weight: 400;
line-height: 1;
}
.spec .section {
margin-top: 4em;
}
.spec table {
margin-top: 3em;
width: 960px;
font-size: 0.9rem;
}
.spec tr:nth-child(even){
background:#f5f5f5;
}
.spec table th {
padding: 0.8em 1.2em;;
text-align: left;
vertical-align: center;
font-weight: 400;
}
.spec table td {
padding: 0.8em 1.2em;
vertical-align: center;
text-align: left;
}
.spec div.cap {
margin-top: 4em;
margin-bottom: 8em;
padding: 0.8em 1.2em;
}
.spec .annotation-block p {
display: inline-block;
margin-top: 0.4em;
vertical-align: top;
line-height: 1.4;
}
@media screen and (min-width: 641px) {
.spec .annotation-block p,
.spec .cap {
font-size: 0.75rem;
}
.spec .annotation-block .asterisk {
width: 3%;
}
.spec .annotation-block .cap {
width: 96%;
}
}
@media screen and (max-width: 640px) {
.spec .annotation-block .asterisk {
width: 5%;
}
.spec .annotation-block .cap {
width: 94%;
}
}
.spec .specsheet {
display: block;
margin-bottom: 1em;
padding: 0.8em 0;
width: 100%;
font-weight: bold;
text-decoration: underline;
font-size: 0.75rem;
}
.spec .partsname {
padding: 0 80px 0 0;
vertical-align: top;
}
.spec .partsname li {
padding-left: 1em;
padding-bottom: 0.5em;
text-indent: -1em;
text-align: left;
}
.spec ul {
margin-top: 40px;
}
.spec li {
padding-left: 1em;
padding-bottom: 0.6em;
text-indent: -1em;
font-size: 0.9rem;
}
.spec li img {
margin-right: 3px;
}
.container .news {
padding: 60px;
}
.container .news dl {
margin: 2.5em auto 0;
max-width: 960px;
text-align: left;
font-size: 0.8rem;
color: #616161;
}
.container .news dt {
float: left;
padding-top: 0.5em;
}
.container .news dd {
width: 80%;
margin-left: 6em;
padding-top: 0.5em;
}
@media screen and (max-width: 640px) {
.spec {
margin: 40px auto;
width: 100%;
}
.spec .section {
margin-top: 2em;
}
.spec .cap {
margin-top: 1em;
margin-bottom: 0;
}
.spec .cap a {
text-decoration: underline;
}
.spec h2 {
margin-top: 2em;
font-size: 1.6rem;
font-weight: 300;
}
.spec h3 {
font-size: 1.26rem;
font-weight: 300;
line-height: 1.5;
}
.spec table {
width: 100%;
}
.spec table th {
display: block;
width: 100%;
font-weight: bold;
}
.spec table td {
display: block;
}
.spec ul {
margin-top: 0;
}
.spec ul li {
display: block;
margin: 0 auto;
width: 90%;
font-size: 0.75rem;
}
.spec dl {
width: 100%;
}
.container .news {
padding: 30px;
}
}
/* 豕ｨ驥� */
ul.notes {
max-width: 960px;
margin-right:auto;
margin-left:auto;
margin-top:0;
}
ul.notes li{
margin-top: 0.5em;
font-size: 0.66rem;
line-height: 1.5;
text-align:left;
}
ul.notes.em_num li {
padding-left: 1.8em !important;
text-indent: -1.8em !important;
}
ul.notes.em_num2 li {
padding-left: 2.3em !important;
text-indent: -2.3em !important;
}
ul.notes.em_nospace li {
padding-left: 1em !important;
text-indent: -1em !important;
}
ul.notes.em_space li {
padding-left: 1.2em !important;
text-indent: -1.2em !important;
}
@media screen and (min-width: 641px) {
.spec ul.notes li{
font-size: 0.75rem;
padding-bottom:0.1em;
}
}
@media (max-width: 640px) {
ul.notes {
width: 94%;
margin-left: auto;
margin-right: auto;
}
.spec ul.notes {
width:auto;
}
.spec .cap ul.notes li {
width:auto;
}
.spec ul.notes li {
width:92%;
padding-bottom:0.1em;
}
}
/* PDF繧｢繧､繧ｳ繝ｳ */
.link--pdf{
background-position: right center;
background-repeat: no-repeat;
padding-right: 18px;
background-image: url(../../../k-tai/common_v2/images/icon_pdf.gif) ;
}
.spec .link--pdf{
}
/* 逕ｻ蜒乗ｯ碑ｼ�せ繝ｩ繧､繝繝ｼ逕ｨ豕ｨ驥� */
.container .comparison_cap {
margin-top:1em;
text-align:right;
}
@media (max-width: 640px) {
.container .comparison_cap {
margin-top:0.5em;
text-align:center;
font-size:0.68rem;
}
}
/* 繝ｫ繝� */
ruby rt, ruby rp {
font-size: 0.4em;
color: #717071;
letter-spacing: 2px;
text-align: center;
}
/* 荳ｻ縺ｪ迚ｹ髟ｷ2蛻�牡繝ｬ繧､繧｢繧ｦ繝� */
.point {
display:table;
width:100%;
}
.point h3 {
font-size:2.5rem;
}
.point .point_left {
display:table-cell;
width:50%;
}
.point .point_left img {
width:100%;
}
.point .point_right {
display:table-cell;
width:50%;
vertical-align:middle;
text-align:left !important;
}
.point .point_right > * {
margin-left:85px;
margin-right:30px;
}
@media screen and (max-width: 640px) {
.point {
display:block;
}
.point h3 {
font-size:1.46rem;
}
.point .point_left {
display:block;
width:100%;
margin-bottom:2em;
}
.point .point_right {
display:block;
width:100%;
text-align:center !important;
}
.point .point_right > * {
margin-left:auto;
margin-right:auto;
}
}
/* 繧ｹ繝壹ャ繧ｯ繝壹�繧ｸ 讖溯�繝ｻ繧ｵ繝ｼ繝薙せ荳隕ｧ 隧ｳ邏ｰ迚� */
.spec_table {
border-top:1px solid #e3e3e3;
margin-top:3em;
font-size:15px;
font-weight:300;
}
.spec_table .row {
display:table;
padding:35px 0;
border-bottom:1px solid #e3e3e3;
}
.spec_table .row .col_ttl {
display:table-cell;
width:240px;
vertical-align:top;
}
.spec_table .row .col_ttl h4 {
font-size:20px;
margin:3px 0;
padding-right:20px;
}
.spec_table .row .col_ttl .spec_link a {
color:#08c;
font-size:14px;
text-decoration:none;
padding-left:3px;
}
.spec_table .row .col_ttl .spec_link a:after {
display:inline;
content:url(../images/ico_spec_link.gif);
padding-left:5px;
}
.spec_table .row .col_ttl .spec_link a:hover {
text-decoration:underline;
}
.spec_table .row .col_dtl {
display:table-cell;
width:720px;
}
.spec_table .row .col_dtl .spec_img {
margin-bottom:6px;
}
.spec_table .row .col_dtl dl .dt1,
.spec_table .row .col_dtl dl .dt2,
.spec_table .row .col_dtl dl dd {
padding:6px 0;
}
.spec_table .row .col_dtl dl .dt1 {
width:720px;
clear:left;
}
.spec_table .row .col_dtl dl .dt2 {
clear: left;
float:left;
width:240px;
}
.spec_table .row .col_dtl dl dd {
margin-left:240px;
}
@media screen and (max-width: 640px) {
.spec_table {
border-top:none;
margin:3em auto 0;
font-size:14px;
width:94%;
}
.spec_table .row {
display:block;
padding:0;
border-bottom:none;
margin-bottom:40px;
}
.spec_table .row .col_ttl {
display:block;
width:auto;
position:relative;
}
.spec_table .row .col_ttl h4 {
font-size:18px;
border-bottom:1px solid #ccc;
padding-bottom:5px;
padding-right:65px;
max-width:100% !important;
}
.spec_table .row .col_ttl .spec_link {
position:absolute;
bottom:6px;
right:0;
width:auto;
}
.spec_table .row .col_dtl {
display:block;
width:auto;
padding-top:5px;
}
.spec_table .row .col_dtl .spec_img {
margin-top:12px;
}
.spec_table .row .col_dtl dl .dt1 {
width:auto;
}
.spec_table .row .col_dtl dl .dt2 {
float:none;
width:auto;
font-weight:400;
}
.spec_table .row .col_dtl dl dd {
margin-left:0;
font-size:12px;
padding-top:0;
color:#444;
padding-left:1em;
}
}
span.maru {
display:inline-block;
width:1em;
text-indent:-1em;
overflow:hidden;
background-image:url(../images/txt_maru.png);
background-repeat:no-repeat;
background-size:1em;
background-position:0 50%;
vertical-align:bottom;
}
/* H2繝ｻH3 繧ｿ繧､繝医Ν縺ｮ荳贋ｻ倥″譁�ｭ苓ｪｿ謨ｴ */
.container h2 sup, .container h3 sup {
font-size: 42%;
top: -1em;
}
/* PC譎ゅΜ繝ｳ繧ｯ辟｡蜉ｹ縲√せ繝槭�譎ゅ�縺ｿ繝ｪ繝ｳ繧ｯ譛牙柑 */
@media screen and (min-width: 641px) {
.link_forSP {pointer-events:none}
}
/* 繧ｳ繧ｳ繝ｭ繝励Ο繧ｸ繧ｧ繧ｯ繝郁ｪｬ譏� */
.cocoro {
box-sizing: border-box;
width:960px;
margin:5em auto 0;
padding:1em 3em;
border:1px solid #333;
}
.cocoro img {
float:left;
margin-right:3em;
width:100px
}
.cocoro p {
margin-top:1em;
}
.cocoroplus {
box-sizing: border-box;
width:960px;
margin:5em auto 0;
padding:1em 3em;
border:1px solid #333;
}
.cocoroplus img {
float:left;
margin-right:3em;
width:100px
}
.cocoroplus p {
margin-top:1em;
}
@media screen and (max-width: 640px) {
.cocoro {
width:auto;
margin:3em 1em 0;
padding:1em 1em;
border:1px solid #333;
}
.cocoro img {
margin-right:1em;
width:45px
}
.cocoro p {
margin:0;
width:auto;
}
.cocoroplus {
width:auto;
margin:3em 1em 0;
padding:1em 1em;
border:1px solid #333;
}
.cocoroplus img {
margin-right:1em;
width:70px
}
.cocoroplus p {
margin:0;
width:auto;
}
}
/* 陬ｽ蜩√ヨ繝��繝壹�繧ｸ縺ｮFacebook縺ｨ繝｡繝ｫ繝槭ぎ縺ｮ繝舌リ繝ｼ */
.snsBanner {
position:absolute;
width:100%;
bottom:5%;
left:0;
margin-bottom:50px
}
.snsBanner ul {
width:84%/*75%*/;
min-width:960px;
margin:0 auto;
padding:0 10px;
}
.snsBanner ul.left {
text-align:left;
}
.snsBanner ul.right {
text-align:right;
}
.snsBanner li {
display:inline-block;
vertical-align:bottom;
text-align:left;
margin-right: 5px;
position:relative;
}
.snsBanner li:last-child {
margin-right: 0;
}
.snsBanner li a {
box-sizing: border-box;
display:block;
height:46px;
/*font-size:13px;*/
font-size:0.8125rem;
text-decoration:none;
border-radius:3px;
line-height:16px;
font-weight: 600;
background-color:#F5F5F5;
}
.snsBanner li a:hover {
opacity:0.7;
}
.snsBanner li.fb a {
width:280px;
border:1px solid #3664a2;
color:#3664a2;
padding:6px 0px 6px 43px;
background:#F5F5F5 url(../../../k-tai/common_v3/images/icon_bnr_facebook.png) no-repeat 6px 50%;
background-size:33px;
}
.snsBanner li.ml a {
width:200px;
border:1px solid #c59042;
color:#c59042;
padding:6px 0px 6px 42px;
background:#F5F5F5 url(../../../k-tai/common_v3/images/icon_bnr_mail.png) no-repeat 10px 50%;
background-size:24px;
}
.snsBanner li.shshow a {
width:300px;
border:1px solid #3B3BCE;
color:#3B3BCE;
padding:6px 0px 6px 45px;
background:#F5F5F5 url("../../../k-tai/common_v3/images/icon_bnr_shshow.png") no-repeat 5px 50%;
background-size:36px;
}
.snsBanner li.fb .fb-like {
position:absolute;
top:13px;
/*left:210px; */
right:5px;
}
@media (max-width: 640px) {
.snsBanner {
position: static;
width:100%;
background-color:#f2f2f2;
padding:10px 0;
margin-bottom:0
}
.snsBanner ul {
width:300px;
min-width:0;
padding:0;
}
.snsBanner ul li {
display:block;
margin-right:0;
}
.snsBanner li a {
display:block;
margin:5px auto;
/*border-radius:4px;*/
}
.snsBanner li.fb a {
width:100%;
padding-left:45px;
background-color:#FFF;
}
.snsBanner li.ml a {
width:100%;
padding-left:45px;
background-color:#FFF;
background-size:28px;
background-position:9px 50%;
line-height:32px;
}
.snsBanner li.shshow a {
width:100%;
padding-left:45px;
background-color:#FFF;
}
.snsBanner li.ml a br{
display:none;
}
/*.snsBanner li.fb .fb-like {
top: 11px;
left: 218px;
}*/
}
/*--------------------------------------------------
ROBOTO繝輔か繝ｳ繝亥ｯｾ蠢�
--------------------------------------------------*/
.roboto {
/*font-family: 'Roboto', 'Noto Sans Japanese', sans-serif;*/
font-family: 'Roboto', 'Noto Sans JP', sans-serif;
}
.roboto100 {
/*font-family: 'Roboto', 'Noto Sans Japanese', sans-serif;*/
font-family: 'Roboto', 'Noto Sans JP', sans-serif;
font-weight: 100 !important;
}
.roboto200 {
/*font-family: 'Roboto', 'Noto Sans Japanese', sans-serif;*/
font-family: 'Roboto', 'Noto Sans JP', sans-serif;
font-weight: 200 !important;
}
.roboto300 {
/*font-family: 'Roboto', 'Noto Sans Japanese', sans-serif;*/
font-family: 'Roboto', 'Noto Sans JP', sans-serif;
font-weight: 300 !important;
}
.roboto400 {
/*font-family: 'Roboto', 'Noto Sans Japanese', sans-serif;*/
font-family: 'Roboto', 'Noto Sans JP', sans-serif;
font-weight: 400 !important;
}
.roboto500 {
/*font-family: 'Roboto', 'Noto Sans Japanese', sans-serif;*/
font-family: 'Roboto', 'Noto Sans JP', sans-serif;
font-weight: 500 !important;
}
.roboto700 {
/*font-family: 'Roboto', 'Noto Sans Japanese', sans-serif;*/
font-family: 'Roboto', 'Noto Sans JP', sans-serif;
font-weight: 700 !important;
}
.roboto900 {
/*font-family: 'Roboto', 'Noto Sans Japanese', sans-serif;*/
font-family: 'Roboto', 'Noto Sans JP', sans-serif;
font-weight: 900 !important;
}
/*---*/
.roboto300-400,.roboto300-500,.roboto300-700 {
/*font-family: 'Roboto', 'Noto Sans Japanese', sans-serif;*/
font-family: 'Roboto', 'Noto Sans JP', sans-serif;
font-weight: 300 !important;
}
.roboto400-500,.roboto400-700 {
/*font-family: 'Roboto', 'Noto Sans Japanese', sans-serif;*/
font-family: 'Roboto', 'Noto Sans JP', sans-serif;
font-weight: 400 !important;
}
@media screen and (max-width: 640px) {
.roboto300-400 { font-weight:400 !important;}
.roboto300-500,.roboto400-500 {font-weight:500 !important;}
.roboto300-700,.roboto400-700 {font-weight:700 !important;}
}