div.sub_txt01 h3 {font-size:24px; padding:0 0 20px 16px; position:relative; color:#2c334f;} div.sub_txt01 h3::before {content:""; height:22px; width:4px; background-color:#beaf84; position:absolute; top:7px; left:0px; } div.intro {line-height:28px; font-size:15px; overflow: hidden; letter-spacing:-0.03em;} div.intro div.contL {float:left; width:30%; padding:5% 3% 2% 3%;} div.intro div.contR {float:right; width:70%; padding:5% 3% 2% 3%;} div.intro div.contR p.txtP01 {color:#bc9958; font-size:20px; font-weight:500; padding:0px 10px 22px 0px;} div.sub_txt02 P {letter-spacing:-0.03em; color:#454545;} #law01 {background-color:#f5f5f5; padding:12px; width:100%; margin:0px;} div.wd11 section {float:left; width:13%; box-sizing:border-box; } div.wd11 section div{font-size:17px; background-color:#2b324e; background-repeat:no-repeat; background-position: center 0px; display:block; min-height:30px; box-sizing:border-box; text-align:center; } div.wd11 section.Box_01 div p {vertical-align: middle; overflow:hidden; padding:22px 10px 22px 10px; letter-spacing:-0.03em;} div.wd11 section.Box_02 div p {vertical-align: middle; overflow:hidden; padding:23px 10px 23px 10px; letter-spacing:-0.03em;} div.wd11 section.Box_03 div p {vertical-align: middle; overflow:hidden; padding:34px 10px 34px 10px; letter-spacing:-0.03em;} div.wd11 section.Box_04 div p {vertical-align: middle; overflow:hidden; padding:83px 10px 83px 10px; letter-spacing:-0.03em;} div.wd11 section.Box_05 div p {vertical-align: middle; overflow:hidden; padding:40px 10px 40px 10px; letter-spacing:-0.03em;} div.wd11 section strong {font-size:18px; font-weight:400; letter-spacing:-0.03em;} div.wd11 section div:hover {box-shadow:5px 6px 15px #999; -moz-transition: ease-out 0.4s 0.1s; -o-transition: ease-out 0.4s 0.1s; -webkit-transition: ease-out 0.4s; -webkit-transition-delay: 0.1s; transition: ease-out 0.4s 0.1s;} /*#about_01 section.Box_01 div{background-image:url("../img/img1.jpg"); } #about_01 section.Box_02 div{background-image:url("../img/img2.jpg"); } #about_01 section.Box_03 div{background-image:url("../img/img3.jpg"); }*/ /*button effect*/ .link-effect-12 div { position: relative; overflow: hidden; } .link-effect-12 div p::before { height:4px; width: 100%; background-color: #beaf84; content: ""; position: absolute; left: 0; top: 0; -moz-transform: translateX(-100%); -ms-transform: translateX(-100%); -webkit-transform: translateX(-100%); transform: translateX(-100%); -moz-transition: 0.4s; -o-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s; } .link-effect-12 div p::after { height:4px; width: 100%; background: #beaf84; content: ""; position: absolute; right: 0; bottom: 0; -moz-transform: translateX(100%); -ms-transform: translateX(100%); -webkit-transform: translateX(100%); transform: translateX(100%); -moz-transition: 0.4s; -o-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s; } .link-effect-12 div::before { width:4px; height: 100%; background: #beaf84; content: ""; position: absolute; left: 0; top: 0; -moz-transform: translateY(100%); -ms-transform: translateY(100%); -webkit-transform: translateY(100%); transform: translateY(100%); -moz-transition: 0.4s; -o-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s; } .link-effect-12 div::after { width:4px; height: 100%; background: #beaf84; content: ""; position: absolute; right: 0px; bottom: 0; -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -webkit-transform: translateY(-100%); transform: translateY(-100%); -moz-transition: 0.4s; -o-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s; } .link-effect-12 div:hover::before, .link-effect-12 div:hover::after { -moz-transform: translateX(0); -ms-transform: translateX(0); -webkit-transform: translateX(0); transform: translateX(0); } .link-effect-12 div:hover p::before, .link-effect-12 div:hover p::after { -moz-transform: translateX(0); -ms-transform: translateX(0); -webkit-transform: translateX(0); transform: translateX(0); } div.wd11 p.txtP { padding:17px 10px; float:right; width:85%; letter-spacing:-0.03em; color:#454545;} *, *::before, *::after { box-sizing: border-box;} .m-content { padding: 0px; max-width: 100%; margin: 0 auto;} .m-timeline { position: relative; list-style: none; padding: 0; margin: 0; color: #333;} .m-timeline > li { position: relative; padding: 0px 0 0px 30px; transition: all 100ms;} .m-timeline > li::before, .m-timeline li::after { transition: all 100ms;} .m-timeline > li::before { display: block; content: ''; position: absolute; top: 30px; left: 0; z-index: 2; background-color: #fff; width: 20px; height: 20px; border-radius: 50%; border: 3px solid #beaf84;} .m-timeline > li::after { content: ''; display: block; width: 2px; background-color: #ddd; position: absolute; top: 0; left: 0px; height: 130%; z-index: 1;} .m-timeline > li:first-child::after { top: 30px;} .m-timeline > li:last-child::after { height: 20px;} .m-timeline__date { display:block; padding:15px 15px; border:1px solid #dfdfdf; border-radius:10px; margin:1% 2% 1% 1%; width:98%; box-sizing:border-box; float:left; font-size:17px; color:#2b324e; letter-spacing:-0.03em;} .m-timeline__date:hover {background-color:#f5f5f5;} .m-timeline p { margin: 0 0 .5em;} @media (min-width: 1024px) { .m-timeline > li::before { left: calc(0px); } .m-timeline > li::after { left: calc(9px); } } ul.detail {list-style:none; padding:15px;} ul.detail li .txtP {color:#454545; letter-spacing:-0.03em; font-size:16px; line-height:28px; padding:0 0 0 15px; background:url("../img/bullet_01.gif") no-repeat 2px center } #block_01 {width:100%; } #block_01 div.icoBox {overflow:hidden; margin:10px 0 0 50px; border: 1px solid #f5f5f5;} #block_01 section{display:block; font-size:13px; padding:18px 10px 18px 10px; text-align:center; border-radius:50%; margin:1% 1%; width:8%; box-sizing:border-box; float:left; font-size:16px; background: #eff1f7; color:#2c334f;} #block_01 section.section02{display:block; font-size:13px; padding:30px 3px 30px 3px; text-align:center; border-radius:50%; margin:1% 1%; width:8%; box-sizing:border-box; float:left; font-size:16px; background: #eff1f7; color:#2c334f;} #block_01 p.txtP01{ padding:17px 15px 17px 15px; float:right; width:90%; font-size:16px; color:#454545;} #block_01 p.txtP02{ padding:28px 15px 28px 15px; float:right; width:90%; font-size:16px; color:#454545;} #block_01 p.txtP03{ padding:40px 15px 40px 15px; float:right; width:90%; font-size:16px; color:#454545;} #block_01 p.txtP04{ padding:40px 15px 40px 15px; float:right; width:90%; font-size:16px; color:#454545;} #block_01 p.txtP05{ padding:40px 15px 40px 15px; float:right; width:90%; font-size:16px; color:#454545;} div.img {text-align:center;} div.img img{ width:82%;} .faq .faq-list { font-size: 0; margin: 0 auto 30px auto; width: 100%; padding-left: 0;} .faq .faq-item { margin-bottom: 0px;} .faq .faq-question { background:url("../img/ico_q.jpg")no-repeat left center; background-size:25px auto; padding: 20px 24px 18px 45px; border-bottom:1px solid #dfdfdf; position: relative; transition: 0.25s ease-in-out;} .faq .faq-question h6 { font-size: 20px; margin: 0; color: #333; font-weight: 600;} .faq .faq-question:before { position: absolute; right: 15px; top: 33px; content: ""; width: 20px; height: 2px; background: #3fb6a8;} .faq .faq-question:after { position: absolute; right: 24px; top: 24px; width: 2px; background: #3fb6a8; height: 20px; content: ""; transition: 0.25s ease-in-out;} .faq .faq-question:hover { cursor: pointer; } .faq .faq-answer { font-size: 16px; margin-top: 1px; max-height: 0; visibility: hidden; padding-top: 0; padding-bottom: 0; transition: .4s ease all;} .question-active + .faq-answer { max-height: 1500px; visibility: visible; transition: 0.4s ease all;} .question-active + .faq-answer p { opacity: 1; transition: .4s ease all;} .question-active:after { opacity: 0;} #block_02 {border: 1px solid #f5f5f5; overflow:hidden; margin: 10px 50px 25px 50px;} #block_02 div.icoBox1 {overflow:hidden; float:left; width:49%; height:150px;} #block_02 div.icoBox2 {overflow:hidden; float:right; width:49%; height:150px;} #block_02 section{display:block; padding:15px; text-align:center; border-radius:50%; margin:7% 10px;; width:16.8%; box-sizing:border-box; float:left; font-size:28px; border: 5px solid #f9f6ec; color:#2c334f; } #block_02 section:hover {background-color:#f9f6ec;} .subtit h3{ margin:0px 0px 0px 50px; } .subtit h3 span.cr { color:#beaf84; } .subtit h3.titcr_m {display:none;} #block_02 p.txtP01{ padding:47px 15px; float:right; width:79%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_02 p.txtP02{ padding:47px 15px; float:right; width:79%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_02 p.txtP03{ padding:32px 15px; float:right; width:79%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_02 p.txtP04{ padding:47px 15px; float:right; width:79%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_02 p.txtP05{ padding:19px 15px; float:right; width:79%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_02 p.txtP06{ padding:47px 15px; float:right; width:79%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_02 p.txtP07{ padding:47px 15px; float:right; width:79%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_02 p.txtP08{ padding:33px 15px; float:right; width:79%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_02 p.txtP09{ background-color:#fafafa; overflow:hidden; padding:15px; width:79%; font-size:16px; color:#454545; letter-spacing:-0.03em; line-height:28px; width:100%; } #block_02 p.txtP01 .sm { font-size:16px; color:#585858;} #block_02 p.txtP02 .sm { font-size:16px; color:#585858;} #block_02 p.txtP03 .sm { font-size:16px; color:#585858;} #block_02 p.txtP04 .sm { font-size:16px; color:#585858; } #block_02 p.txtP05 .sm { font-size:16px; color:#585858; } #block_02 p.txtP06 .sm { font-size:16px; color:#585858;} #block_02 p.txtP07 .sm { font-size:16px; color:#585858;} #block_02 p.txtP08 .sm { font-size:16px; color:#585858;} #block_03 {border: 1px solid #f5f5f5; overflow:hidden; margin: 10px 50px 25px 50px;} #block_03 div.icoBox1 {overflow:hidden; float:left; width:49%; height:150px;} #block_03 div.icoBox2 {overflow:hidden; float:right; width:49%; height:150px;} #block_03 section{display:block; padding:12px 15px; text-align:center; border-radius:50%; margin:7% 10px; width:16.8%; box-sizing:border-box; float:left; font-size:16px; border: 5px solid #f9f6ec; color:#2c334f; } #block_03 section.th{display:block; padding:0px 6px; text-align:center; border-radius:50%; margin:7% 10px; width:16.8%; box-sizing:border-box; float:left; font-size:16px; border: 5px solid #f9f6ec; color:#2c334f; } #block_03 section:hover {background-color:#f9f6ec;} #block_03 p.txtP01{ padding:32px 15px; float:right; width:79%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_03 p.txtP02{ padding:32px 15px; float:right; width:79%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_03 p.txtP03{ padding:47px 15px; float:right; width:79%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_03 p.txtP01 .sm { font-size:16px; color:#585858;} #block_03 p.txtP02 .sm { font-size:16px; color:#585858;} #block_03 p.txtP03 .sm { font-size:16px; color:#585858;} #block_04 {border: 1px solid #f5f5f5; overflow:hidden; margin: 10px 50px 25px 50px;} #block_04 div.icoBox1 {overflow:hidden; float:left; width:49%; height:150px;} #block_04 div.icoBox2 {overflow:hidden; float:right; width:49%; height:150px;} #block_04 div.icoBox3 {overflow:hidden; float:left; width:49%; } #block_04 div.icoBox4 {overflow:hidden; float:right; width:49%;} #block_04 section{display:block; padding:0px 6px; text-align:center; border-radius:50%; margin:7% 10px; width:16.8%; box-sizing:border-box; float:left; font-size:16px; border: 5px solid #f9f6ec; color:#2c334f; } #block_04 section.th{display:block; padding:0px 6px; text-align:center; border-radius:50%; margin:7% 10px 3% 10px; width:16.8%; box-sizing:border-box; float:left; font-size:16px; border: 5px solid #f9f6ec; color:#2c334f; } #block_04 section.no{display:none;} #block_04 span.cr { color:#beaf84;} #block_04 section:hover {background-color:#f9f6ec;} #block_04 p.txtP01{ padding:32px 15px; float:right; width:79%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_04 p.txtP02{ padding:74px 15px; float:right; width:79%; } #block_04 p.txtP03{ padding:32px 15px 0px 15px; float:right; width:79%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_04 p.txtP04{ padding:32px 15px 0px 15px; float:right; width:100%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_04 p.txtP05{ overflow:hidden; padding:15px 116px 32px 116px; font-size:16px; color:#6b6b6b; letter-spacing:-0.03em; line-height:28px; width:100%; } #block_04 p.txtP01 .sm { font-size:16px; color:#585858;} #block_04 p.txtP03 .sm { font-size:16px; color:#585858; } #block_05 {border: 1px solid #f5f5f5; overflow:hidden; margin: 10px 50px 25px 50px;} #block_05 div.icoBox1 {overflow:hidden; float:left; width:49%; height:150px;} #block_05 div.icoBox2 {overflow:hidden; float:right; width:49%; height:150px;} #block_05 div.icoBox3 {overflow:hidden; float:left; width:49%; } #block_05 div.icoBox4 {overflow:hidden; float:right; width:49%;} #block_05 section{display:block; padding:12px 15px; text-align:center; border-radius:50%; margin:7% 10px; width:16.8%; box-sizing:border-box; float:left; font-size:16px; border: 5px solid #f9f6ec; color:#2c334f; } #block_05 section.th{display:block; padding:0px 6px; text-align:center; border-radius:50%; margin:7% 10px; width:16.8%; box-sizing:border-box; float:left; font-size:16px; border: 5px solid #f9f6ec; color:#2c334f; } #block_05 section.no{display:none;} #block_05 span.cr { color:#beaf84;} #block_05 section:hover {background-color:#f9f6ec;} #block_05 p.txtP01{ padding:32px 15px; float:right; width:79%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_05 p.txtP02{ padding:32px 15px 0px 15px; float:right; width:100%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_05 p.txtP03{ padding:32px 15px 0px 15px; float:right; width:79%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_05 p.txtP04{ padding:32px 15px 0px 15px; float:right; width:100%; font-size:17px; color:#454545; letter-spacing:-0.03em; line-height:28px; } #block_05 p.txtP05{ overflow:hidden; padding:15px 116px 32px 116px; font-size:16px; color:#6b6b6b; letter-spacing:-0.03em; line-height:28px; width:100%; } #block_05 p.txtP01 .sm { font-size:16px; color:#585858;} #block_05 p.txtP03 .sm { font-size:16px; color:#585858; } /*--------------------------------------- MOBILE RESPONSIVE -----------------------------------------*/ @media (max-width: 1023px) { div.intro div.contL {float:none; width:100%; text-align:center; } div.intro div.contR {float:none; width:100%; text-align:center;} div.intro div.contR p.txtP01 {font-size:18px; letter-spacing:-0.03em;} div.wd_11 {width:100%; margin:50px auto 0 auto;} div.wd11 section {float:none; width:100%; } section nav div { border:1px solid #dfdfdf;} section strong {opacity: 1; } div.wd11 section.Box_01 div p {vertical-align: middle; overflow:hidden; padding:20px 10px 20px 10px; letter-spacing:-0.03em;} div.wd11 section.Box_02 div p {vertical-align: middle; overflow:hidden; padding:20px 10px 20px 10px; letter-spacing:-0.03em;} div.wd11 section.Box_03 div p {vertical-align: middle; overflow:hidden; padding:20px 10px 20px 10px; letter-spacing:-0.03em;} div.wd11 section.Box_04 div p {vertical-align: middle; overflow:hidden; padding:20px 10px 20px 10px; letter-spacing:-0.03em;} div.wd11 section.Box_05 div p {vertical-align: middle; overflow:hidden; padding:20px 10px 20px 10px; letter-spacing:-0.03em;} section span.txt01{ font-size:16px; line-height:25px; } div.wd11 p.txtP { padding-top:20px; padding-bottom:20px; width:100%;} ul.detail_L li {font-size:12px; line-height:25px; padding:0 0 0 18px; background:url("../img/bullet_01.gif") no-repeat 5px center } .m-timeline > li::after { left: 9px; } ul.detail li span.detailD {color:#aaa; padding: 0 10px 0 0; } div.hr {width:100%; margin:0px; border: 0; border-bottom: 1px dashed #efe3c2; background: #ffffff;} div.hr hr {display: none;} div.tit_sub h3 { text-align:center; padding-top:25px; padding-bottom:8px; font-size:18px;} #block_01 {width:100%; margin: auto; } #block_01 div.icoBox {overflow:hidden; margin:10px; border: 0px;} #block_01 section {display:block; font-size:17px; text-align:center; border-radius:10px; margin:2% 2%; width:98%; box-sizing:border-box; } #block_01 section.section02 {display:block; font-size:17px; text-align:center; border-radius:10px; margin:2% 2%; width:98%; box-sizing:border-box; padding:18px 10px 18px 10px;} #block_01 p.txtP01{ padding:10px 10px 10px 10px; width:98%; font-size:16px; letter-spacing:-0.03em;} #block_01 p.txtP02{ padding:10px 10px 10px 10px; width:98%; font-size:16px; letter-spacing:-0.03em;} #block_01 p.txtP03{ padding:10px 10px 10px 10px; width:98%; font-size:16px; letter-spacing:-0.03em;} #block_01 p.txtP04{ padding:10px 10px 10px 10px; width:98%; font-size:16px; letter-spacing:-0.03em;} #block_01 p.txtP05{ padding:10px 10px 0px 10px; width:98%; font-size:16px; letter-spacing:-0.03em;} #block_01 div.icoBox hr {display:none;} div.img img{ width:100% } div.subtit h3 {text-align:center; padding-bottom:8px; font-size:18px; margin: 0 0 0 0 ;} div.subtit h3.titcr {display:none;} div.subtit h3.titcr_m {display: block; text-align:center; padding-bottom:8px; font-size:18px; margin: 0 0 0 0 ; } #block_02 {width:100%; margin: 0 auto 30px auto;} #block_02 div.icoBox1 {overflow:hidden; float:none; width:100%; height:auto;} #block_02 div.icoBox2 {overflow:hidden; float:none; width:100%; height:auto;} #block_02 section {display:block; font-size:17px; border-radius:10px; margin:2% 2% 4% 2%; width:96%; box-sizing:border-box; background-color:#fafafa; border: 0; } #block_02 p.txtP01{ padding:15px 0; font-size:16px; text-align:center; width:100%; float: none;} #block_02 p.txtP02{ padding:15px 0; font-size:16px; text-align:center; width:100%; float: none;} #block_02 p.txtP03{ padding:15px 0; font-size:16px; text-align:center; width:100%; float: none;} #block_02 p.txtP04{ padding:15px 0; font-size:16px; text-align:center; width:100%; float: none;} #block_02 p.txtP05{ padding:15px 0; font-size:16px; text-align:center; width:100%; float: none;} #block_02 p.txtP06{ padding:15px 0; font-size:16px; text-align:center; width:100%; float: none;} #block_02 p.txtP07{ padding:15px 0; font-size:16px; text-align:center; width:100%; float: none;} #block_02 p.txtP08{ padding:30px 0; font-size:16px; text-align:center; width:100%; float: none; } #block_02 div.icoBox1 hr {display:none;} #block_02 div.icoBox2 hr {display:none;} #block_03 {width:100%; margin: 0 auto 30px auto;} #block_03 div.icoBox1 {overflow:hidden; float:none; width:100%; height:auto;} #block_03 div.icoBox2 {overflow:hidden; float:none; width:100%; height:auto;} #block_03 section {display:block; font-size:17px; padding:15px 15px; border-radius:10px; margin:2% 2% 4% 2%; width:96%; box-sizing:border-box; background-color:#fafafa; border: 0; } #block_03 section.th {display:block; font-size:17px; padding:15px 15px; border-radius:10px; margin:2% 2% 4% 2%; width:96%; box-sizing:border-box; background-color:#fafafa; border: 0; } #block_03 p.txtP01{ padding:15px 0; font-size:16px; text-align:center; width:100%; float: none;} #block_03 p.txtP02{ padding:15px 0; font-size:16px; text-align:center; width:100%; float: none;} #block_03 p.txtP03{ padding:30px 0; font-size:16px; text-align:center; width:100%; float: none;} #block_03 div.icoBox1 hr {display:none;} #block_03 div.icoBox2 hr {display:none;} #block_04 {width:100%; margin: 0 auto 30px auto;} #block_04 div.icoBox1 {overflow:hidden; float:none; width:100%; height:auto;} #block_04 div.icoBox2 {overflow:hidden; float:none; width:100%; height:auto;} #block_04 div.icoBox3 {overflow:hidden; float:none; width:100%; height:auto;} #block_04 div.icoBox4 {overflow:hidden; float:none; width:100%; height:auto;} #block_04 section.th {display: none;} #block_04 section.no {display:block; font-size:17px; padding:15px 15px; border-radius:10px; margin:2% 2% 4% 2%; width:96%; box-sizing:border-box; background-color:#fafafa; border: 0; } #block_04 p.txtP01{ padding:15px 0; font-size:16px; text-align:center; width:100%; float: none;} #block_04 p.txtP02{ display: none;} #block_04 p.txtP03{ padding:15px 0 5px 0; font-size:16px; text-align:center; width:100%; float: none;} #block_04 p.txtP04{ padding:5px 0 15px 0; font-size:16px; text-align:center; width:100%; float: none;} #block_04 p.txtP05{ padding:15px 0 35px 0; font-size:16px; text-align:center; width:100%; float: none;} #block_04 hr.h {display:none;} .faq .faq-question { padding: 20px 34px 18px 35px; } .faq .faq-question h6 { font-size: 16px; } .faq .faq-answer p { font-size:16px; line-height: 26px; padding: 26px 5px 26px 35px } .question-active + .faq-answer { max-height: 2000px;} } @media (max-width: 768px) { #service section {width:100%; margin:2% 0%;} } @media (max-width: 640px) { #block_02 section a {width:98%;} } @media (max-width: 480px) { } #about_01 section {float:left; width:100%;} @media (max-width: 320px) { }