body{ -webkit-font-smoothing: subpixel-antialiased; } p{ font-size:14px; line-height: 1.5; word-wrap : break-word; overflow-wrap : break-word; /*word-break: keep-all;*/ } img{ max-width: 100%; } .contents{ font-feature-settings : "palt"; } /*.modal{ opacity: 0; display: block!important; z-index: -1; } .modal.in{ opacity:1; display: block!important; z-index: 10000; } .modal.in .modal-content{ z-index: 100001; }*/ .item-box{ background: #edeff0; padding:40px 40px; margin-top: 100px; margin-bottom: 30px; } .item-ttl{ text-align: center; font-size: 27px; color:#1b2d5a; font-weight: bold; } .topSection, .topSubSection { padding: 30px 20px; } .topSection__heading, .topSubSection__heading { color: #231815; font-size: 18px; font-weight: bold; } .topSection__heading__inner { display: inline-block; border-left: 5px solid #8AD1EB; padding: 0 0 0 7px; } .topSection__heading__sub { font-size: 12px; display: block; } .topSection__more, .topSubSection__more { text-align: center; font-weight: bold; } .topSection__more a, .topSubSection__more a { color: #2F2725; display: block; background: #FFF100; position: relative; padding: 10px; } _:-ms-input-placeholder, :root .topSection__more a, .topSubSection__more a{ font-family: Meiryo, sans-serif; padding:12px 10px 8px; } .topSection__more a:before, .topSubSection__more a:before { content: ""; display: inline-block; width: 9px; height: 17px; margin: 0 10px 0 0; background-image: url(../../solution/img/arrow_more.png); background-repeat: no-repeat; background-size: contain; vertical-align: bottom; } /*202101変更箇所*/ .tab1Area { background: #1B2D5A; } .tab1List { margin: 15px auto; } .tab1List__item:not(:last-child) { margin: 0 0 15px; } .tab1List__item img { width: 100%; height: auto; } .tab2Area { background: #89a8ce; } .tab2List { margin: 15px auto; } .tab2List__item:not(:last-child) { margin: 0 0 15px; } .tab2List__item img { width: 100%; height: auto; } /*202101変更箇所ここまで*/ .documentArea { background: #F9F4D4; } .documentList { margin: 15px auto; } .documentList__item:not(:last-child) { margin: 0 0 15px; } .documentList__item img { width: 100%; height: auto; } .topSubSection__heading { font-size: 17px; } /*繧ソ繧、繝医Ν*/ .topSection.tab1Area .title1{ font-size:19px; text-align: center; color:#fff; padding-top: 30px; padding-bottom: 25px; line-height: 1; font-weight: bold; border-top:1px solid #fff; } .topSection.tab1Area .title1 span{ font-size:27px; } .topSection.tab1Area .title1.mbn{ padding-bottom: 15px; } .topSection h3{ text-align: center; font-size:16px; line-height: 1; color:#89a8ce; background: #fff; padding-top: 6px; padding-bottom: 6px; font-weight: bold; } .title3{ text-align: center; font-size:21px; line-height: 1; background:#80cde9; color: #fff; padding-top: 8px; padding-bottom: 8px; font-weight: bold; } /*tab蛻�j譖ソ縺�*/ .cp_tab *, .cp_tab *:before, .cp_tab *:after { -webkit-box-sizing: border-box; box-sizing: border-box; } .cp_tab { margin: 1em auto; font-size:0; } .cp_tab label { font-size: 21px; font-weight: bold; } .cp_tab > input[type='radio'] { margin: 0; padding: 0; border: none; border-radius: 0; outline: none; background: none; -webkit-appearance: none; appearance: none; display: none; } .cp_tab .cp_tabpanel { display: none; } .cp_tab > input:first-child:checked ~ .cp_tabpanels > .cp_tabpanel:first-child, .cp_tab > input:nth-child(3):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(2), .cp_tab > input:nth-child(5):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(3), .cp_tab > input:nth-child(7):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(4), .cp_tab > input:nth-child(9):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(5), .cp_tab > input:nth-child(11):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(6) { display: block; } .cp_tab > label { position: relative; display: inline-block; padding: 15px; cursor: pointer; border: 1px solid transparent; border-bottom: 0; vertical-align: bottom; } .cp_tab > label:hover{ opacity: 0.7; } .cp_tab > input:checked + label { margin-bottom: -1px; /*border-color: #cccccc; border-bottom: 1px solid #ffffff;*//*閭梧勹濶イ縺ィ蜷後§*/ /*border-radius: 6px 6px 0 0;*/ } .tab1_1{ background: #89a8ce; color:#fff; width: 438.5px; margin-right: 6px; } .tab1_2{ background: #80cde9; color:#fff; width: 438.5px; margin-right: 0%; } .cp_tab .cp_tabpanel { /*padding: 0.5em 1em; border-top: 1px solid #cccccc;*/ } .modal-content .detailClose { position: absolute; bottom: 10px; right: 10px; display: block; width: auto; height: auto; line-height: 0; cursor: pointer; outline: none; } .cp_tab > label span{ padding-right:25px ; background: url(../../solution/img/arrow_bg.png) no-repeat right center; background-size:13px; } /*譁ー隕剰ィ倩ソー邂�園*/ .wrap{ width: 810px; margin-left: auto; margin-right: auto; } .movie-box{ margin-top: 48px; } .movie-box h2{ color:#58c3e5; text-align: center; font-size:21px; line-height: 1; border-top:1px solid #58c3e5; border-bottom:1px solid #58c3e5; padding-top: 8px; padding-bottom: 8px; font-weight: bold; } .movie-wrap{ width: 748px; margin-left: auto; margin-right: auto; } .movie-name{ padding-left: 10px; background: url(../../solution/img/arrow.png) no-repeat left center; background-size: 6px; font-size: 12px; line-height: 1; margin-top: 6px; } .movie-left{ width: 523px; float: left; } .movie-left img,.movie-right img{ width: 100%; } .movie-right ul li{ margin-bottom: 10px; } .point-box{ border-top:1px solid #58c3e5; border-bottom:1px solid #58c3e5; padding-top: 28px; padding-bottom: 25px; } .point-box h2{ color:#58c3e5; font-size:31px; line-height: 1.35; font-weight: bold; text-align: center; } .pont-tex{ padding-top: 4px; padding-bottom: 4px; font-size:17px; line-height: 1; color:#4c4948; font-weight: bold; margin-top: 12px; } .modal-movie-box{ width: 540px; margin-left: auto; margin-right: auto; padding:6% 6% 9%; box-sizing: border-box; } .modal-movie-box iframe{ width: 100%; } .bottomBnr { padding: 20px 15px; background: #f9f4d4; } .bottomBnr img { width: 100%; height: auto; } /*繧ォ繝�ざ繝ェ繝シ繝��繝悶Ν*/ .item-table table{ border: 1px solid #89a8ce; width: 100%; } .item-table table tr:first-child th{ background: #89a8ce; color:#fff; font-size: 22px; line-height: 1; padding:10px 0; text-align: center; font-weight: bold; } .item-table table tr:nth-child(2) th{ background: #cedcf2; color:#595757;; font-size: 19px; line-height: 1; padding:13px 0 10px; text-align: center; font-weight: normal; } .item-table table tr:nth-child(2) th:first-child{ border-right: 1px solid #89a8ce; } .item-table table tr:nth-child(2) th:nth-child(3){ border-left: 1px solid #89a8ce; } .item-table table tr td{ border-right: 1px solid #89a8ce; padding:20px 10px; text-align: center; background: #fff; } .item-box .item-table.MT30 table tr td{ vertical-align: top; } .item-table table tr td a.link{ text-decoration: underline; } .item-table.ptn1 table tr td ul li{ display: inline-block; vertical-align: middle; } .item-table.ptn2 table tr td ul li:last-child{ padding-top: 15px; } .item-table.ptn1 table tr td img{ margin-right: 0px; margin-bottom: 10px; } .item-table table tr td img{ width: 100px; } .item-table table tr td.big-img img{ /*width: 144px;*/ padding-top: 22px; padding-bottom: 22px; } .item-table table tr td a{ display: block; width: 100%; height: 100%; } .item-table table tr td ul li{ font-size:18px; color:#89a8ce; /*text-decoration: underline;*/ } .item-table table tr td.img-border{ border-right: none; background:#fff url(../../solution/img/border.png) repeat-y right center; } .item-table .link-btn{ max-width: 350px; margin-left: auto; margin-right: auto; display: block; } .link-btn { color: #fff; background: #595757; min-width: 235px; display: inline-block; vertical-align: middle; padding: 10px 20px; text-align: center; white-space: nowrap; font-size: 13px; line-height: 15px; -webkit-box-sizing: border-box; box-sizing: border-box; max-width: 235px; } .link-btn::before { content: ""; display: inline-block; width: 13px; height: 15px; line-height: 15px; background:url(../img/link_arrow_bg.png) no-repeat left top; background-size:100%; margin: 0 10px 0 0; -ms-flex-negative: 0; flex-shrink: 0; vertical-align: middle; } .prt_inq { width: 740px; margin-left: auto; margin-right: auto; } .prt_inq .prt_inq_txt_box { float: left; width: 400px; } .prt_inq .prt_inq_txt_box p { text-align: left; } .prt_inq .prt_inq_txt_box .prt_inq_title { font-size: 16px; font-weight: bold; } .prt_inq .prt_inq_txt_box .prt_inq_txt { margin-top: 10px; } .prt_inq .prt_inq_btn { float: right; width: 320px; } .prt_inq .prt_inq_btn a { display: block; text-align: center; padding: 30px 0px; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f39800+0,f39800+71,bc7500+100 */ background: #f39800; /* Old browsers */ background: -moz-linear-gradient(top, #f39800 0%, #f39800 71%, #bc7500 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #f39800 0%,#f39800 71%,#bc7500 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #f39800 0%,#f39800 71%,#bc7500 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f39800', endColorstr='#bc7500',GradientType=0 ); /* IE6-9 */ } .prt_inq .prt_inq_btn a span { display: inline-block; padding-right: 26px; background-image: url(../../img/arrow_inq_01.png); background-repeat: no-repeat; background-size: 16px auto; background-position: right center; color: #fff; font-weight: bold; font-size: 20px; } @media screen and (min-width: 641px) { p { font-size: 14px; line-height: 1.9; } .main { width: 883px; margin-right: 2px; } /*202101変更箇所*/ .topSection, .topSubSection { padding: 37px 37px 37px; } .topSection.ex{ padding: 37px 37px 37px; } /*202101変更箇所ここまで*/ .topSection__heading, .topSubSection__heading { background: inherit; position: relative; } .topSection__heading::before, .topSubSection__heading::before { content: ""; display: block; width: 100%; height: 1px; background: #575554; position: absolute; top: 50%; left: 0; } .topSection__heading__inner { background: inherit; display: inline-block; padding: 0 10px; position: relative; } .topSection__more, .topSubSection__more { width: 362px; margin: auto; line-height: 17px; } .topSection__more a, .topSubSection__more a { padding: 12px; } .topSection__more a:before, .topSubSection__more a:before { position: absolute; top: 12px; left: 17px; } .tab1List { margin: 15px auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .tab1List::after { content: ""; display: block; width: 191px; } .tab1List__item { width: 191px; } .tab2List { margin: 0px auto 0; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .tab2List::after { content: ""; display: block; width: 257px; } .tab2List__item { width: 257px; } .documentList { margin: 30px auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .topSubSection__heading__inner { background: inherit; position: relative; display: inline-block; padding: 0 10px 0 0; } .lineUp__list { margin: 30px auto 0; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } /*繝「繝シ繝€繝ォ 蜊ー蛻キ繝ェ繧ケ繝�*/ .modal-content.topSection{ /*width: 883px;*/ width: 883px; } .modal-content.topSection ul{ margin:20px 0 20px; } .modal-content.topSection ul li{ margin-bottom: 20px; } /*繧ソ繝門�繧頑崛縺�*/ .cp_tab > label { text-align: center; } .modal-content .detailClose { bottom: 15px; right: 15px; } /*譁ー隕剰ィ倩ソー邂�園*/ .wrap2{ width: 860px; } .movie-right{ width: 169px; float: right; height: 314px; overflow-y: scroll; padding-right: 11px; margin-right: 11px; } .pont-tex{ width: 630px; text-align: center; margin-left: auto; margin-right: auto; background: url(../../solution/img/ttl_bg.png) no-repeat center top; background-size:100%; } .bottomBnr { padding: 45px 0; margin-top: 65px; width: 860px; text-align: center; /*background: #edeff0;*/ } .bottomBnr img { width: auto; } } @media screen and (max-width: 640px) { .item-ttl{ font-size: 20px; } .item-box{ padding:27px 12px 28px; margin-top: 15%; margin-bottom:5%; } .wrapper .item-box { margin-left: -20px; margin-right: -20px; width: calc(100% + 40px); box-sizing: border-box; } .tab1Area{ font-size:0; } .tab1List::after { content: ""; width: 48%; } .tab1List__item { width: 48%; display: inline-block; } .tab1List__item:nth-child(odd) { margin-right: 4%; } .tab1List__item:nth-child(even) { margin-right: 0%; } .topSection__heading, .topSubSection__heading { color: #231815; font-size: 24px; font-weight: bold; } .topSection__heading__inner { display: inline-block; border-left: 5px solid #8AD1EB; padding: 0 0 0 12px; } .topSection__heading__sub { font-size: 16px; display: block; } /*tab蛻�j譖ソ縺�*/ .tab1_1{ background: #89a8ce; color:#fff; width: 49.2%; margin-right: 1.6%; } .tab1_2{ background: #80cde9; color:#fff; width: 49.2%; margin-right: 0%; } .cp_tab { /*width: 100%;*/ font-size: 0; } .cp_tab label { padding:0.8em 0.5em; font-size:4.2vw; text-align: center; } .cp_tab > label span{ display: block; padding-right:0% ; background-position: center bottom; padding-bottom: 8%; } .modal-movie-box{ width: 90%; padding: 6% 2% 9%; } /*繧ソ繧、繝医Ν*/ .topSection.tab1Area .title1{ font-size:14px; padding-top: 5%; padding-bottom: 5%; } .topSection.tab1Area .title1 span{ font-size:20px; } .topSection.tab1Area .title1.mbn{ padding-bottom: 0; } .topSection h3{ font-size:14px; padding-top: 1.5%; padding-bottom: 1.5%; } .title3{ font-size:14px; padding-top: 3%; padding-bottom: 3%; } /*譁ー隕剰ィ倩ソー邂�園*/ .wrap{ width: 100%; margin-left: auto; margin-right: auto; } .wrapper{ padding-left: 20px; padding-right: 20px; } .wrapper-all{ padding:20px; } .movie-box{ margin-top: 7%; } .movie-box h2{ font-size:14px; padding-top: 3%; padding-bottom: 3%; } .movie-wrap{ width: 100%; } .movie-left{ width: 100%; float:none; } .movie-left .movie-name{ width: 70%; /*padding-top: 2%; padding-bottom: 2%;*/ margin-top: 3%; padding-left: 4%; } .movie-name{ font-size:14px; margin-top: 4%; padding-left: 8%; /*background-image:none; background-color:#999899; color:#fff;*/ text-align: left; /*padding-top: 5%; padding-bottom: 5%; width: 90%; margin-left: auto; margin-right: auto;*/ } .movie-right{ width: 100%; float:none; background: #E4E4E4; padding-top: 7%; padding-bottom: 5%; /*padding-left: 5%; padding-right: 5%; box-sizing: border-box;*/ } .movie-right .sp-slide{ padding-left: 6%; padding-right: 6%; box-sizing: border-box; position: relative; } /*.movie-right .sp-slide .swiper-slide{ margin-right: 1%!important; margin-left: 1%!important; width: 49%!important; }*/ /*.movie-right .sp-slide .swiper-container{ overflow: visible; } .movie-right .sp-slide .swiper-container .swiper-wrapper{ overflow: hidden; z-index: 1; position: relative; }*/ .movie-right .swiper-button-prev{ background:url(../../solution/img/prew.png) no-repeat center center; background-size:100%; width: 1%; left:-3%; padding-left: 2%; padding-right: 2%; top: 42%; /*height: 100%;*/ } .movie-right .swiper-button-next{ background:url(../../solution/img/next.png) no-repeat center center; background-size:100%; width: 1%; right:-3%; padding-left: 2%; padding-right: 2%; top: 42%; /*height: 100%;*/ } .point-box{ padding-top: 6%; padding-bottom: 6%; } .point-box h2{ font-size:5.6vw; } .pont-tex{ padding-left: 2%; padding-right: 2%; padding-top: 4%; padding-bottom: 4.5%; /*margin-top: 2%;*/ /*background-image:url(../img/ttl_bg_01.png),url(../img/ttl_bg_02.png); background-repeat:no-repeat,no-repeat; background-position:left center,right center;*/ background: url(../../solution/img/ttl_bg_sp.png) no-repeat center top; background-size:100%; } .pont-tex p{ /*background: #fff100; width:92%;*/ font-size:3.73vw; line-height: 1.35; margin-left: auto; margin-right: auto; text-align: center; } .modal-movie-box { width: 90%; max-width: 540px; margin-left: auto; margin-right: auto; padding: 10% 4%; box-sizing: border-box; } /*繧ォ繝�ざ繝ェ繝シ繝��繝悶Ν*/ .item-table table{ border: 1px solid #89a8ce; width: 100%; margin-bottom: 18px; } .item-table table tr:first-child th{ background: #89a8ce; color:#fff; font-size: 17px; line-height: 1; padding:10px 0; text-align: center; font-weight: bold; } .item-table table tr:nth-child(2) th{ /*background: #edeff0;*/ font-size: 14px; line-height: 1; padding:13px 6px 10px; text-align: center; } .item-table table tr:nth-child(2) th:first-child{ border-right: 1px solid #89a8ce; } .item-table table tr:nth-child(2) th:nth-child(3){ border-left: 1px solid #89a8ce; } .item-box .item-table:last-child table tr td{ width: 20%; } .item-table table tr td{ border-right: 1px solid #89a8ce; padding:10px; text-align: center; } .item-table.ptn1 table tr td ul li{ display: inline-block; vertical-align: middle; } .item-table.ptn1 table tr td img{ margin-right: 0px; max-width: 70%; } .item-table table tr td img{ width: auto; } .item-table table tr td.big-img img{ width: auto; padding-top: 28%; padding-bottom: 19%; } .item-table table tr td ul li{ font-size:11px; margin-top: 6%; /*color:#89a8ce;*/ } .item-table table tr:nth-child(3) td:first-child p{ margin-top: 28%!important; } .item-table table tr td ul li small,.item-table table tr td ul li p{ font-size:80%; line-height: 1.2; display: block; } .item-table table tr td.img-border{ background-size:2%; } .item-table.ptn1 .link-btn{ margin-bottom: 28px!important; } .item-table .link-btn{ max-width: calc(100% - 60px); min-width: calc(100% - 60px); margin-left: auto; margin-right: auto; display: block; } .prt_inq { width: 100%; } .prt_inq .prt_inq_txt_box, .prt_inq .prt_inq_btn { float: none; width: 100%; } .prt_inq .prt_inq_txt_box .prt_inq_title { font-size: 16px; font-weight: bold; } .prt_inq .prt_inq_txt_box .prt_inq_txt { margin-top: 5px; } .prt_inq .prt_inq_btn { margin-top: 12px; } .prt_inq .prt_inq_btn a { padding: 20px 0px; } .prt_inq .prt_inq_btn a span { display: inline-block; padding-right: 26px; font-size: 20px; } }