@charset "utf-8";

/* ==================================================
Common CSS
================================================== */

@media(max-width:959px){

/*STYLE*/
.pc {
display:none;
}

p {
font-size:4vw;
line-height:150%;
letter-spacing:0.2vw;
}

img {
width:100%;
height:auto;
}


/*COMMON*/
header {
display:none;
}

header .header_area {
}

h1 {
}

.icons a {
}


/*GROBAL*/
.fixed {
position:fixed;
width:100%;
height:100%;
z-index:999;
}

#grobal {
position:fixed;
top:0;
left:0;
z-index:99;
}

#grobal .grobal_navs {
}

#grobal .nav_btn {
position:relative;
width:13vw;
height:13vw;
overflow:hidden;
top:0;
margin-left:87vw;
background:#004ea2;
cursor:pointer;
}

#grobal .nav_btn span {
width:50%;
height:0.8vw;
background:#fff;
position:absolute;
left:0;
right:0;
margin:auto;
}

#grobal .nav_btn span:nth-child(1) { top:3vw; }
#grobal .nav_btn span:nth-child(2) { top:6vw; }
#grobal .nav_btn span:nth-child(3) { top:9vw; }

#grobal .nav_close {
display:none;
position:fixed;
width:100%;
height:100%;
top:0;
left:0;
background:#000;
opacity:0;
z-index:98;
cursor:pointer;
}

#grobal .grobal_navs {
display:none;
position:relative;
width:100%;
z-index:99;
}

#grobal .grobal_navs nav {
border-bottom:#004ea2 1px dotted;
background:rgba(255,255,255,0.95);
}

#grobal .grobal_navs nav:first-child {
border-top:#004ea2 1px dotted;
}

#grobal .grobal_navs nav a {
text-decoration:none;
font-weight:normal;
color:#004ea2;
display:block;
padding:4vw 5vw;
font-size:4.5vw;
text-align:center;
}

#grobal .grobal_navs nav a:hover {
background:#fafafa;
}


/*TITLE*/
.title {
background:linear-gradient(#fcfcfc,#eaeaea);
border-bottom:#e1e1e1 1px solid;
margin-bottom:12px;
}

.title .title_area {
width:92%;
margin:auto;
display:flex;
align-items:center;
justify-content:space-between;
}

.title .title_area .logo {
width:65vw;
}

.title .title_area .right_cts {
display:flex;
padding-top:3vw;
position:relative;
}

.title .title_area .right_cts .goto {
width:35vw;
margin-right:2vw;
}

.title .title_area .right_cts .party_logo {
width:15vw;
position:absolute;
right:0;
top:26vw;
}

.bread {
width:90%;
margin:0 auto 5vw;
font-size:2.5vw;
color:#969696;
text-align:left;
}

.title .title_area.under {
overflow:hidden;
}

.title .title_area.under .logo {
width:40vw;
}

.title .title_area.under .right_cts {
padding-top:1vw;
}

.title .title_area.under .right_cts .goto {
width:14.7vw;
margin-right:10vw;
}

.title .title_area.under .right_cts .party_logo {
width:12vw;
top:3.5vw;
right:25vw;
}


/*TOP_COMMON*/
.cts {
width:90%;
margin:auto;
}

.cate {
text-align:center;
}

.cate .cate_title {
font-size:8vw;
color:#004ea2;
padding-bottom:1.5vw;
font-weight:bold;
}

.cate .cate_title span {
padding:0 1vw 1vw;
}

.cate .cate_sub {
padding-bottom:5vw;
font-size:3vw;
}

.cate .cate_copy {
padding-bottom:5vw;
}


/*TOP*/
.container {
width:100%;
margin:auto;
padding-bottom:40px;
}

.container .container_left {
width:100%;
margin-bottom:40px;
}

.container .container_right {
width:100%;
max-width:300px;
margin:auto;
}




.intro {
/*background:#faeb96;*/
padding:6vw 0;
}

.intro .introductions {
width:90%;
margin:0 auto 50px;
}

.intro .introductions .introduction {
width:100%;
margin-bottom:3vw;
border:#ececec 1px solid;
}

.intro .introductions .introduction:last-child {
margin-bottom:0;
}

.intro .introductions .introduction a {
display:block;
text-decoration:none;
display:flex;
}

.intro .introductions .introduction a:hover {
opacity:0.8;
}

.intro .introductions .introduction .photo {
width:25%
}

.intro .introductions .introduction .intro_data {
background:linear-gradient(#fff,#fafafa);
border-left:none;
width:75%;
}

.intro .introductions .introduction .intro_data .intro_title {
width:85%;
margin:auto;
font-weight:bold;
padding:3vw 0 1vw;
color:#004ea2;
font-size:4.5vw;
}

.intro .introductions .introduction .intro_data .copy {
width:85%;
margin:0 auto 10px;
font-size:3vw;
color:#323232;
}

.flyer_title {
width:90%;
margin:auto;
display:flex;
justify-content:center;
align-items:center;
padding-bottom:30px;
position:relative;
}

.flyer_title .deco {
width:100%;
height:1px;
background:#004ea2;
}

.flyer_title p {
color:#004ea2;
font-size:110%;
font-weight:bold;
position:absolute;
background:#fff;
padding:0 10px;
}

.flyers {
}

.flyers .flyer:first-child {
width:90%;
margin:0 auto 20px;
}

.flyers .flyer:last-child {
width:70%;
margin:auto;
}

.flyers .flyer .cap {
font-size:80%;
margin-top:10px;
display:none;
}

.flyers .flyer a:hover {
opacity:0.7;
}

.flyers .flyer img {
border:#e1e1e1 1px solid;
}

.message {
padding:0 0 10vw;
}

.message .cate {
padding-bottom:15px;
margin-bottom:15px;
text-align:center;
}

.message .cate .cate_title {
font-size:200%;
border-bottom:#004ea2 1px solid;
display:inline-block;
}

.message .cts .navs {
width:100%;
display:flex;
flex-wrap:wrap;
justify-content:space-between;
align-items:center;
}

.message .cts .navs nav {
width:100%;
margin-bottom:3.5vw;
text-align:center;
}

.message .cts .navs nav:nth-child(n+9){
margin-bottom:0;
}

.message .cts .navs nav img {
border-radius:10vw;
}

.message .cts .navs nav a {
text-decoration:none;
background:#eaf4f9;
color:#004ea2;
padding:2.5vw;
display:block;
border:#004ea2 1px dotted;
border-radius:10px;
}

.message .cts .navs nav a:hover {
opacity:0.8;
}

.message .cts .navs nav .icon {
width:20vw;
margin:0 auto 3vw;
}

.message .cts .navs nav .target {
font-size:3.5vw;
}

.message .cts .navs nav .target .area {
font-size:4.5vw;
}

#localTop {
padding-bottom:50px;
}

#localTop .cate {
padding-bottom:15px;
margin-bottom:15px;
text-align:center;
}

#localTop .cate .cate_title {
font-size:200%;
border-bottom:#004ea2 1px solid;
display:inline-block;
}

#localTop .cts .navs {
width:100%;
display:flex;
flex-wrap:wrap;
justify-content:space-between;
align-items:center;
}

#localTop .cts .navs nav {
width:48%;
margin-bottom:3.5vw;
text-align:center;
}

#localTop .cts .navs nav:nth-child(n+7){
margin-bottom:0;
}

#localTop .cts .navs nav a {
text-decoration:none;
background:#eaf4f9;
color:#004ea2;
padding:15px;
display:block;
border:#004ea2 1px dotted;
border-radius:10px;
}

#localTop .cts .navs nav a:hover {
opacity:0.8;
}

#localTop .cts .navs nav .icon {
width:70px;
margin:0 auto 15px;
}

#localTop .cts .navs nav .target {
font-size:80%;
}

#localTop .cts .navs nav .target .area {
font-size:150%;
}

.information {
padding-top:5vw;
}

.information .more {
}

.information .more a {
display:block;
background:#004ea2;
border-radius:10vw;
padding:3vw;
color:#fff;
text-decoration:none;
text-align:center;
font-size:4vw;
width:40vw;
margin:auto;
}

.information .more a:hover {
opacity:0.8;
}

.information .more a i {
padding-left:3vw;
}

.mail_magazine_banner {
width:90%;
margin:0 auto 30px;
}


.mail_magazine {
width:90%;
margin:0 auto 5vw;
background:url("../img/bg.png");
padding:10vw 5vw;
text-align:center;
}

.mail_magazine .subcopy {
color:#004ea2;
font-weight:bold;
}

.mail_magazine .maincopy {
color:#004ea2;
font-weight:bold;
font-size:7vw;
}

.mail_magazine .ex {
padding-bottom:3vw;
}

.mail_magazine form .formstyle {
width:100%;
padding:3vw 4vw;
font-size:4vw;
color:#323232;
margin-bottom:3vw;
}

.mail_magazine form .regist {
background:#004ea2;
color:#fff;
padding:3vw 5vw;
border-radius:10px;
margin-right:2vw;
font-size:4vw;
}

.mail_magazine form .cancel {
background:#969696;
color:#fff;
padding:3vw 5vw;
border-radius:10px;
font-size:4vw;
}


/*FACEBOOK*/
.fb-container {
width:90%;
max-width:500px;
margin:auto;
}

.cts_flex {
width:100%;
margin:auto;
}


/*ANNOUNCE*/
.announce {
width:90%;
margin:auto;
border:#b40000 1px solid;
padding:4vw 5vw;
margin-bottom:70px;
}

.announce div {
font-size:4vw;
line-height:150%;
letter-spacing:0.2vw;
}

.announce .announce_title {
font-size:5vw;
font-weight:bold;
color:#b40000;
text-align:center;
padding-bottom:1vw;
}

.announce .item {
font-size:4.5vw;
font-weight:bold;
}

.announce .detail {
font-size:4vw;
}


/*SNS*/
.facebook {
width:100%;
position:fixed;
bottom:0;
right:0;
z-index:99;
background:#3a5a98;
text-align:center;
}

.facebook a {
display:block;
}

.facebook img {
width:50vw;
}

.line {
width:50vw;
position:fixed;
bottom:0;
left:0;
z-index:99;
}

.facebook a:hover , .line a:hover {
opacity:0.8;
}

.sns {
-webkit-animation:sns 1s ease;
animation:sns 1s ease;
}

@keyframes sns {
0%{transform:translateY(100%);}
100%{transform:translateY(0);}
}

.btn_youtube {
width:50vw;
position:fixed;
bottom:0;
left:0;
z-index:99;
background:#ea3223;
border-top:rgba(255,255,255,1) 1px solid;
}

.btn_mail_magazine {
width:50vw;
position:fixed;
bottom:0;
right:0;
z-index:99;
background:#004ea2;
border-top:rgba(255,255,255,1) 1px solid;
border-left:rgba(255,255,255,1) 1px solid;
}






/*INFORMATION*/
.topics {
}

.topics .topic {
border:#e1e1e1 1px dotted;
background:#fafafa;
margin-bottom:3vw;
}

.topics .topic a {
display:block;
text-decoration:none;
}

.topics .topic a:hover {
opacity:0.8;
}

.topics .topic .topic_cts {
padding:4vw;
display:flex;
justify-content:space-between;
}

.topics .topic .topic_cts .photo {
width:30%;
padding-right:3vw;
}

.topics .topic .topic_cts .data {
width:70%;
}

.topics .topic .topic_cts .data .date {
color:#787878;
font-size:3vw;
}

.topics .topic .topic_cts .data .item {
font-weight:bold;
color:#004ea2;
padding-bottom:1vw;
font-size:4.5vw;
}

.topics .topic .topic_cts .data .ex {
color:#323232;
font-size:3.5vw;
}

.topics .pagenation {
display:flex;
justify-content:center;
margin-bottom:7vw;
}

.topics .pagenation nav {
margin:0 1vw;
}

.topics .pagenation nav a {
display:block;
font-size:3.5vw;
color:#004ea2;
text-decoration:none;
border:#004ea2 1px dotted;
padding:2vw 3vw;
border-radius:1vw;
}

.topics .pagenation nav a:hover {
opacity:0.8;
}

.topics .pagenation .now a {
color:#ccc;
border:#ccc 1px dotted;
background:#fafafa;
}

.topics .detail {
border:#e1e1e1 1px dotted;
background:#fafafa;
padding:6vw 6vw;
margin-bottom:5vw;
}

.topics .detail .date {
text-align:center;
font-size:4vw;
padding-bottom:2vw;
}

.topics .detail .date span {
border-bottom:#ccc 1px solid;
padding:0 1vw 1vw;
}

.topics .detail .item {
font-size:6vw;
text-align:center;
font-weight:bold;
padding-bottom:5vw;
color:#004ea2;
}

.topics .detail .photo {
width:100%;
margin:0 auto 5vw;
}

.topics .detail .photo-text {
padding-bottom:5vw;
}

.topics .detail .ex {
padding-bottom:10vw;
}

.topics .detail .backbtn {
padding-top:10vw;
}

.topics .detail .backbtn a {
background:#fff;
}

.topics .detail .backbtn a:hover {
background:#f3f3f3;
}

.topics .detail .pdf {
font-size:4vw;
padding-bottom:3vw;
}

.topics .detail .pdf .icon {
padding-right:1vw;
font-size:5vw;
}

.topics .detail .pdf a {
font-weight:bold;
display:flex;
align-items:center;
}

.topics .detail .pdf a:hover {
opacity:0.8;
}




/*LINKS*/
#links {
width:100%;
margin:10vw auto 0;
}

#links .navs {
display:flex;
justify-content:center;
flex-wrap:wrap;
}

#links .navs nav {
width:50%;
border-bottom:#004ea2 1px dotted;
}

#links .navs nav:before {
color:#e1e1e1;
}

#links .navs nav:nth-child(even) {
border-left:#004ea2 1px dotted;
}

#links .navs nav:nth-child(-n+2)  {
border-top:#004ea2 1px dotted;
}

#links .navs nav:nth-last-child(-n+2) {
border-bottom:none;
}

#links .navs nav a {
display:block;
text-decoration:none;
font-weight:normal;
color:#004ea2;
font-size:3.5vw;
text-align:center;
padding:3vw;
}

#links .navs nav a:hover {
opacity:0.8;
}


/*PAGES COMMON*/
.pagetop {
text-align:center;
}

.pagetop .page_title {
font-size:8vw;
color:#004ea2;
padding-bottom:5vw;
font-weight:bold;
}

.pagetop .page_title span {
padding:0 1vw 1vw;
}

.pagetop .page_sub {
padding-bottom:10vw;
font-size:4vw;
}

h2 {
color:#004ea2;
border-top:#004ea2 1px solid;
border-bottom:#004ea2 1px solid;
padding:3vw 3vw;
margin-bottom:3vw;
font-size:4.5vw;
}

.ex {
padding-bottom:3vw;
}

.backbtn {
}

.backbtn a {
border:#004ea2 1px dotted;
display:block;
width:40%;
font-size:3vw;
margin:auto;
padding:3vw 3vw;
color:#004ea2;
border-radius:3vw;
text-decoration:none;
text-align:center;
}

.iconl {
padding-right:1vw;
}

.iconr {
padding-left:1vw;
}


/*PROFILE*/
#profile section {
padding-bottom:15vw;
}

#profile #biography {
}

#profile #biography .photo {
width:100%;
margin:0 auto 3vw;
}

#profile #biography .biography {
width:100%;
}

#profile #biography .biography aside {
background:#f2f6fa;
padding:4vw 5vw;
margin-bottom:3vw;
}

#profile #biography .biography aside p {
font-size:4vw;
}

#profile #biography .biography aside .item {
font-weight:bold;
color:#004ea2;
border-bottom:#c8c8c8 1px dashed;
padding-bottom:2vw;
margin-bottom:2vw;
}

#profile #biography .biography aside .details {
}

#profile #biography .biography aside .details .detail {
width:100%;
}

#profile #biography .biography aside .details .detail .flexline {
border-bottom:#c8c8c8 1px dashed;
padding-bottom:2vw;
margin-bottom:2vw;
}

#profile #biography .biography aside .details .detail .flexline:last-child {
}

#profile #biography .biography aside .details .detail .left {
width:100%;
font-weight:bold;
}

#profile #biography .biography aside .details .detail .right {
width:100%;
}

#profile #biography .biography aside .details .sub_photo {
width:60%;
margin:0 auto 3vw;
}

#profile #work {
}

#profile #work .photo {
width:50%;
margin:auto;
padding-bottom:3vw;
}

#profile #work .details {
width:100%;
}

#profile #work .details .detail {
background:#f2f6fa;
padding:3vw 4vw;
margin-bottom:3vw;
display:flex;
}

#profile #work .details .detail:last-child {
margin:0;
}

#profile #work .details .detail span:first-child {
padding-right:3vw;
width:25%;
}

#profile #activity {
}

#profile #activity .photo {
width:100%;
padding-bottom:3vw;
}

#profile #activity .details {
width:100%;
}

#profile #activity .details .detail {
background:#f2f6fa;
padding:3vw 4vw;
margin-bottom:3vw;
}

#profile #activity .details .detail:last-child {
margin:0;
}

.profile_pdfs {
text-align:center;
padding-bottom:50px;
display:none;
}

.profile_pdfs .profile_pdf {
display:inline-block;
}

.profile_pdfs .profile_pdf a {
display:flex;
align-items:center;
background:#f5e100;
color:#004ea2;
padding:15px 30px;
border-radius:10vw;
}

.profile_pdfs .profile_pdf a i {
font-size:150%;
padding-right:10px;
}

.profile_pdfs .profile_pdf a p {
font-weight:bold;
}

.profile_pdfs .profile_pdf a:hover {
opacity:0.7;
}

.profile_banners {
width:90%;
margin:0 auto 45px;
}

.profile_banners img {
border:#004ea2 1px solid;
}

.profile_banners:hover {
opacity:0.7;
}

.profile_banners .arrows {
text-align:center;
padding-top:10px;
color:#ed3023;
font-weight:bold;
-webkit-animation:banner 1s infinite ease alternate;
animation:banner 1s infinite ease alternate;
}

@keyframes banner {
0%{transform:scale(1);}
100%{transform:scale(1.05);}
}




/*POLICY*/
#policy {
}

#policy section {
background:#f2f6fa;
padding:6vw 6vw;
margin-bottom:5vw;
}

#policy section:nth-child(even) {
}

#policy section:nth-child(5) .photo {
width:70%;
margin:auto;
}

#policy .photo {
width:100%;
padding-bottom:4vw;
}

#policy .details {
width:100%;
}

#policy .details .policy {
font-size:5vw;
color:#004ea2;
font-weight:bold;
padding-bottom:2vw;
}

#policy .another_links {
text-align:center;
margin:0 15vw 15vw;
}

#policy .another_links .another_btn {
}

#policy .another_links .another_btn:first-child {
margin-bottom:3vw;
}

#policy .another_links .another_btn a {
display:block;
padding:4vw 4vw;
background:#004ea2;
color:#fff;
text-decoration:none;
border-radius:2vw;
}


/*LOCAL*/
#local {
}

#local .policies {
}

#local .title_list {
margin-bottom:30px;
}

#local .title_list .list_title {
font-weight:bold;
margin-bottom:10px;
border-left:#004ea2 4px solid;
padding:3px 0 3px 10px;
}

#local .title_list .lists {
display:flex;
flex-wrap:wrap;
}

#local .title_list .lists a {
border:#004ea2 1px dotted;
padding:7px 12px;
margin:0 3% 12px 0;
width:48.5%;
border-radius:10px;
display:flex;
justify-content:space-between;
align-items:center;
}

#local .title_list .lists a:hover {
opacity:0.7;
}

#local .title_list .lists a:nth-child(2n) {
margin-right:0;
}

#local .title_list .lists a p {
font-size:85%;
}

#local .title_list .lists a .arrow {
border:#004ea2 1px solid;
border-left:transparent 1px solid;
border-bottom:transparent 1px solid;
width:8px;
height:8px;
transform:rotate(45deg);
}

#local h2 {
font-size:125%;
padding:15px 0;
text-align:center;
}

#local .policies .policy {
background:#f2f6fa;
padding:30px 30px;
margin-bottom:20px;
}

#local .policies .policy .photo {
width:100%;
padding-bottom:20px;
}

#local .policies .policy .details {
width:100%;
}

#local .policies .policy .details .cates {
display:flex;
flex-wrap:wrap;
}

#local .policies .policy .details .cates .cate {
}

#local .policies .policy .details .cates .cate a {
border:#004ea2 1px dotted;
color:#004ea2;
font-size:70%;
margin:0 7px 7px 0;
padding:0 7px;
border-radius:6px;
background:#fff;
display:block;
}

#local .policies .policy .details .cates .cate a:hover {
opacity:0.7;
}

#local .policies .policy .details .areas {
display:flex;
flex-wrap:wrap;
}

#local .policies .policy .details .areas .area {
}

#local .policies .policy .details .areas .area a {
border:#004ea2 1px dotted;
color:#004ea2;
font-size:70%;
margin:0 7px 7px 0;
padding:0 7px;
border-radius:6px;
background:#fff;
display:block;
}

#local .policies .policy .details .areas .area a:hover {
opacity:0.7;
}

#local .policies .policy .details h3 {
font-size:150%;
padding:7px 0;
}

#local .pagenation {
display:flex;
justify-content:center;
align-items:center;
padding-bottom:50px;
}

#local .pagenation nav {
margin:0 5px;;
}

#local .pagenation nav a {
width:30px;
height:30px;
font-size:80%;
border:#004ea2 1px dotted;
display:flex;
justify-content:center;
align-items:center;
border-radius:6px;
}

#local .pagenation nav a.now {
border:#aaa 1px dotted;
color:#aaa;
pointer-events:none;
}

#local .pagenation nav a.none {
border:#aaa 1px dotted;
color:#aaa;
pointer-events:none;
display:none;
}

#local .pagenation nav:first-child a ,
#local .pagenation nav:last-child a {
width:110px;
}

#local .pagenation nav:first-child i {
padding:0 7px 0 0;
}

#local .pagenation nav:last-child i {
padding:0 0 0 7px;
}

#local .pagenation nav a:hover {
opacity:0.7;
}


/*旧LOCAL
#local {
}

#local section {
background:#f2f6fa;
padding:5vw 5vw;
margin-bottom:4vw;
}

#local section.images {
}

#local section.images .details {
width:100%;
}

#local .photo {
width:100%;
padding-bottom:3vw;
}

#local .details .item {
font-weight:bold;
padding-bottom:1vw;
font-size:4.5vw;
color:#004ea2;
}
*/


/*APPROACH*/
#approach {
}

#approach .policies {
}

#approach .title_list {
margin-bottom:30px;
}

#approach .title_list .list_title {
font-weight:bold;
margin-bottom:10px;
border-left:#004ea2 4px solid;
padding:3px 0 3px 10px;
}

#approach .title_list .lists {
display:flex;
flex-wrap:wrap;
}

#approach .title_list .lists a {
border:#004ea2 1px dotted;
padding:7px 12px;
margin:0 3% 12px 0;
width:48.5%;
border-radius:10px;
display:flex;
justify-content:space-between;
align-items:center;
}

#approach .title_list .lists a:hover {
opacity:0.7;
}

#approach .title_list .lists a:nth-child(2n) {
margin-right:0;
}

#approach .title_list .lists a p {
font-size:85%;
}

#approach .title_list .lists a .arrow {
border:#004ea2 1px solid;
border-left:transparent 1px solid;
border-bottom:transparent 1px solid;
width:8px;
height:8px;
transform:rotate(45deg);
}

#approach h2 {
font-size:125%;
padding:15px 0;
text-align:center;
}

#approach .policies .policy {
background:#f2f6fa;
padding:30px 30px;
margin-bottom:20px;
}

#approach .policies .policy .photo {
width:100%;
padding-bottom:20px;
}

#approach .policies .policy .details {
width:100%;
}

#approach .policies .policy .details .cates {
display:flex;
flex-wrap:wrap;
}

#approach .policies .policy .details .cates .cate {
}

#approach .policies .policy .details .cates .cate a {
border:#004ea2 1px dotted;
color:#004ea2;
font-size:70%;
margin:0 7px 7px 0;
padding:0 7px;
border-radius:6px;
background:#fff;
display:flex;
align-items:center;
}

#approach .policies .policy .details .cates .cate a:hover {
opacity:0.7;
}

#approach .policies .policy .details .areas {
display:flex;
flex-wrap:wrap;
}

#approach .policies .policy .details .areas .area {
}

#approach .policies .policy .details .areas .area a {
border:#004ea2 1px dotted;
color:#004ea2;
font-size:70%;
margin:0 7px 7px 0;
padding:0 7px;
border-radius:6px;
background:#fff;
display:flex;
align-items:center;
}

#approach .policies .policy .details .areas .area a:hover {
opacity:0.7;
}

#approach .policies .policy .details h3 {
font-size:150%;
padding:7px 0;
}

#approach .pagenation {
display:flex;
justify-content:center;
align-items:center;
padding-bottom:50px;
}

#approach .pagenation nav {
margin:0 5px;;
}

#approach .pagenation nav a {
width:30px;
height:30px;
font-size:80%;
border:#004ea2 1px dotted;
display:flex;
justify-content:center;
align-items:center;
border-radius:6px;
}

#approach .pagenation nav a.now {
border:#aaa 1px dotted;
color:#aaa;
pointer-events:none;
}

#approach .pagenation nav a.none {
border:#aaa 1px dotted;
color:#aaa;
pointer-events:none;
display:none;
}

#approach .pagenation nav:first-child a ,
#approach .pagenation nav:last-child a {
width:110px;
}

#approach .pagenation nav:first-child i {
padding:0 7px 0 0;
}

#approach .pagenation nav:last-child i {
padding:0 0 0 7px;
}

#approach .pagenation nav a:hover {
opacity:0.7;
}

.cms_arrow {
border:#004ea2 1px solid;
border-left:transparent 1px solid;
border-bottom:transparent 1px solid;
width:6px;
height:6px;
transform:rotate(45deg);
margin-left:5px;
}



/*APPROACH 旧バージョン
#approach {
}

#approach section {
margin-bottom:15vw;
}

#approach .details {
background:#f2f6fa;
padding:5vw 5vw;
margin-bottom:4vw;
}

#approach .details:last-child {
margin:0;
}

#approach .details .item {
display:flex;
}

#approach .details .item p {
font-weight:bold;
padding-bottom:1vw;
font-size:4.5vw;
color:#004ea2;
}

#approach .details .detail {
}

#approach .title_list {
margin-bottom:10vw;
padding:5vw 5vw;
border:#004ea2 1px dotted;
}

#approach .title_list .list_title {
font-weight:bold;
padding-bottom:1vw;
font-size:4.5vw;
}

#approach .title_list .lists {
}

#approach .title_list .lists p {
}

#approach .title_list .lists p a {
font-weight:bold;
}

#approach .title_list .lists p a:hover {
opacity:0.7;
}
*/



/*OFFICE*/
#office {
}

#office section {
padding-bottom:20vw;
}

#office .details {
padding-top:10px;
}

#office .details .map1 {
width:80%;
margin:auto;
padding-bottom:3vw;
}

#office .details .map2 {
width:100%;
padding-bottom:3vw;
}

#office .details .areas {
width:100%;
}

#office .details .areas .area {
padding-bottom:35px;
}

#office .details .areas .area:last-child {
padding-bottom:0;
}

#office .details .area2 {
width:100%;
}

#office .details .item {
font-weight:bold;
font-size:5vw;
padding:0 0 1vw;
}

#office .details .detail {
font-size:5vw;
}

#office .map {
margin-bottom:3vw;
height:100vw;
overflow:hidden;
}


/*STORY*/
#story {
}

#story .swiper-container {
width:100%;
height:140vw;
margin:0 auto 3vw;
border:#ccc 1px solid;
}

#story .flip {
padding-bottom:5vw;
text-align:center;
font-size:3.5vw;
}

#story .flip i {
padding:0 2vw;
}


/*MAIL MAGAZINE*/
.mail_magazine_subtitle {
color:#004ea2;
font-weight:bold;
}

#mail_magazine.cts {
}

#mail_magazine .explain {
padding-bottom:15px;
}

#mail_magazine .explain .fr {
color:#e6321e;
}

#mail_magazine section {
background:url(../img/bg.png);
width:100%;
margin:0 auto 15px;
padding:0 0 30px;
border-radius:0 0 15px 15px;
}

#mail_magazine .mail_magazine_title {
background:#004ea2;
color:#fff;
font-size:110%;
font-weight:bold;
text-align:center;
padding:15px;
border-radius:15px 15px 0 0;
position:relative;
margin-bottom:40px;
}

#mail_magazine .mail_magazine_title:after {
position:absolute;
border-top:#004ea2 16px solid;
border-right:transparent 16px solid;
border-bottom:transparent 16px solid;
border-left:transparent 16px solid;
width:0;
height:0;
content:"";
bottom:-32px;
left:0;
right:0;
margin:auto;
}

#mail_magazine .details {
width:90%;
margin:0 auto 15px;
}

#mail_magazine .details:nth-child(3) {
margin-bottom:35px;
}

#mail_magazine .details:last-child {
margin-bottom:0;
}

#mail_magazine .details .details_cts {
}

#mail_magazine .details .items {
width:100%;
padding-bottom:10px;
}

#mail_magazine .details .items .item {
font-weight:bold;
}

#mail_magazine .details .items .required {
background:#e6321e;
color:#fff;
font-size:70%;
padding:5px 7px;
margin-left:7px;
}

#mail_magazine .details .items .any {
background:#b4bec8;
color:#fff;
font-size:70%;
padding:5px 7px;
margin-left:7px;
}

#mail_magazine .details .detail {
width:100%;
}

#mail_magazine .details .detail .mail_style {
width:100%;
}

#mail_magazine .details .detail .name_style {
width:100%;
}

#mail_magazine .details .detail .area_style {
width:70%;
background:#fff url(../mail_magazine/img/form_arrow.png) no-repeat right;
background-size:10px;
background-position:right 15px center;
}

#mail_magazine .details .detail .address_style {
width:100%;
}

#mail_magazine .btns .submit_btn .submit_style {
background:#e6321e;
color:#fff;
border-radius:10vw;
padding:15px 40px;
cursor:pointer;
font-size:100%;
font-weight:bold;
}

input,select {
font-size:100%;
}

input {
padding:15px 20px;
}

select {
padding:10px 20px;
border-radius:7px;
}

#mail_magazine .no_required {
width:100%;
margin:0 auto 20px;
}

#mail_magazine .no_required_title {
width:90%;
margin:auto;
font-size:90%;
padding-bottom:12px;
}

#mail_magazine .address_attention {
padding-top:10px;
font-size:80%;
}

#mail_magazine .btns {
display:flex;
justify-content:center;
}

#mail_magazine .attentions {
padding-bottom:50px;
}

#mail_magazine .attentions .attention {
font-size:70%;
display:flex;
color:#aaa;
}

#mail_magazine.confirmation {
}

#mail_magazine.confirmation .details {
border-bottom:#ccc 1px dashed;
padding-bottom:18px;
margin-bottom:18px;
}

#mail_magazine.confirmation .details .detail {
font-size:1rem;
line-height:150%;
letter-spacing:1px;
}

#mail_magazine .thanks {
text-align:center;
}

#mail_magazine .thanks .complete {
font-size:150%;
font-weight:bold;
color:#e6321e;
padding-bottom:30px;
}

#mail_magazine .thanks .complete_tx {
padding-bottom:70px;
}

#mail_magazine .thanks .back_home {
}

#mail_magazine .thanks .back_home a {
color:#004ea2;
border:#004ea2 1px solid;
padding:10px 20px;
border-radius:10vw;
font-size:80%;
}

#mail_magazine .thanks .back_home a:hover {
opacity:0.7;
}

#mail_magazine form ul {
width:680px;
margin:0 auto 30px;
border:#e6321e 1px solid;
background:#fff;
padding:15px 20px;
color:#e6321e;
font-size:80%;
}

#mail_magazine form ul li:before {
font-family: "Font Awesome 5 Free";
content:"\f071";
font-weight:900;
font-size:80%;
padding-right:5px;
}

#mail_magazine .warning {
color:#e6321e;
text-align:right;
font-size:80%;
padding-top:5px;
}



/*FOOTER*/
footer {
background:#004ea2;
padding-bottom:15vw;
}

footer .footer_area {
width:100%;
margin:auto;
padding:5vw 0 3vw;
}

footer .footer_area .foot_info {
padding-bottom:4vw;
text-align:center;
}

footer .footer_area .foot_info .foot_logo {
width:45vw;
margin:0 auto 2vw;
}

footer .footer_area .foot_info .office {
font-size:3.5vw;
font-weight:bold;
color:#fff;
}

footer .footer_area .foot_info .data {
font-size:3.5vw;
color:#fff;
}

footer .mail {
width:200px;
margin:auto;
text-align:center;
padding-bottom:30px;
}

footer .mail a {
font-size:80%;
color:#fff;
border:#fff 1px solid;
padding:10px 15px;
display:flex;
justify-content:center;
align-items:center;
position:relative;
}

footer .mail a:hover {
opacity:0.7;
}

footer .mail a .item {
padding-right:10px;
}

footer .mail a .arrow {
width:6px;
height:6px;
border-top:#fff 1px solid;
border-right:#fff 1px solid;
transform:rotate(45deg);
}

footer .footer_area .copyright {
width:90%;
margin:auto;
color:#fff;
text-align:center;
font-size:2.5vw;
}


/*CHANNEL*/
.channel_cts {
width:90%;
margin:0 auto 30px;
display:none;
}

.channel {
width:100%;
border:#ea3223 1px solid;
background:#ea3223;
border-radius:10px;
margin:0 0 0 auto;
}

.channel a {
display:flex;
justify-content:center;
align-items:center;
color:#fff;
font-weight:bold;
padding:15px;
}

.channel a:hover {
opacity:0.7;
}

.channel a i {
color:#fff;
font-size:8vw;
margin-right:10px;
}


}