/* 
    Created on : Jun 21, 2021, 10:45:10 AM
    Author     : ano
*/

.active-menu{
    font-weight: 600;
}
.no-padding-right{
    padding-right: 0;
}
.no-padding-left{
    padding-left: 0;
}
.show-pc-about {
    display: block;
}
.show-mobile-about {
    display: none;
}
/*auto scroll slide*/
.about-top-slide {
    margin: 1.5em auto 1em;
}
.block {
    overflow: hidden;
    width: 100%;
    /* margin: 50px auto; */
    background: #fff;
}
.animation {
    width: auto;
    height: 100px;
    font-size: 0px;
}
.animation div {
    display: inline-block;
    width: auto;
    float: none;
    padding: 0;
}
img {
    vertical-align: middle;
}

.about-left {
    padding-right: 3em;
}
table {
    border-collapse: collapse;
}
.about-table {
    float: none;
    margin: 3em auto;
    padding: 0;
}
.table-list .cell-left {
    width: 30%;
}
.table-list table {
    min-width: 100%;
}
.table-list th, .table-list td {
    background-color: #ffffff;
    border: 1px solid #cacaca;
    padding: 1em 4em;
    text-align: left;
}
.purpose-point ol {
    list-style: none;
    counter-reset: item;
    padding-left: 4em;
    margin-top: 3em;
}
.purpose-point ol li {
    counter-increment: item;
    margin-bottom: 1.5em;
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
}
.purpose-point ol li:before {
    margin-right: 1.5em;
    content: counter(item);
    background-color: #0f3587;
    color: #ffffff;
    width: 15px;
    padding: 2px 5px;
    text-align: center;
    display: inline-block;
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
    margin-left: -3.5em;
    direction: rtl;
}
.banner-bottom-wrap {
    margin: 7em auto 5em;
}
.banner-bottom a p {
    font-size: 12px;
    text-align: center;
    position: relative;
}
.banner-bottom a p {
    font-size: 12px;
    text-align: center;
}
.banner-bottom a:hover p {
    font-weight: bold;
    transition: 500ms ease 0s;
}
.banner-bottom a p:before {
    width: 8px;
    height: 8px;
    box-shadow: -2px 2px 0 #0f3587;
    transform: rotate(225deg);
    content: "";
    position: absolute;
    top: 6px;
    left: 190px;
}
.banner-bottom a:hover p:before {
    box-shadow: -2px 2px 0 #ff8765;
}
.about-menu .menu-list ul li {
    border: 1px solid #cecece;
    border-left: 3px solid #123a89;
    list-style: none;
}
.text-vertical{
    border: 1px solid #c8c8c8;
    border-left: 4px solid #123a89;
    border-top: 0;
    padding: 1em;
    display: flex;
    justify-content: space-between;
}
.first-link .text-vertical{
    border-top: 1px solid #c8c8c8;
}
.sidebar-about-index .link-menu-about:hover{
    transition: 500ms ease 0s;
}
.sidebar-about-index .link-menu-about:hover .min-width-text-side{
    opacity: .6;
    color: #0f3587;
}
.sidebar-about-index .link-menu-about:hover .active p{
    color: #fff;
    opacity: .8;
}
.text-vertical:after{
    content: '';
    border-right: 2px solid #123a89;
    border-top: 2px solid #123a89;
    transform: rotate(45deg);
    height: 10px;
    width: 10px;
    display: inline-block;
    margin-right: .7em;
    align-self: center;
    min-height: 10px;
    min-width: 10px;
}
.text-contact .ui-button .ui-button-text {
    word-break: normal;
    width: auto;
}
.text-contact button#j_idt258 {
    height: auto;
    width: auto;
}
.min-width-text-side{
    min-width: 150px;
    margin: 0;
    color: #0f3587;
    font-size: 16px;
}
.three-underline{
    border-top: 1px solid pink;
}
.table-about-top, th, td{
    padding: 1em;
    text-align: left;
}
.table-about-top td.left-about-top {
    max-width: 80px;
}
.table-about-top td.right-about-top {
    max-width: 635px;
}
.box-number{
    border: 1px solid #0f3587;
    padding: 3px .5em;
    background-color: #0f3587;
    color: white;
    margin-right: 1em;
    font-size: 18px;
    font-weight: normal;
    /*max-width: 30px;*/
    max-height: 30px;
    /*width: 30px;*/
    height: 30px;
    line-height: 22px;
}
.three-underline{
    width: 70px;
    background: #fa7563;
    position: relative;
    height: 1px;
    display: block;
    bottom: 15px;
}
.border-bottom-grey-about-title{
    border-bottom: 2px solid #c8c8c8;
    width: 35px;
    margin: auto;
}
.three-underline:before{
    width: 100%;
    content: '';
    background: #39bddc;
    height: 1px;
    position: absolute;
    bottom: 3px;
    left: 0;
    display: block;
}
.three-underline:after{
    width: 100%;
    content: '';
    background: #ec599f;
    height: 1px;
    position: absolute;
    top: 3px;
    left: 0;
    display: block;
}
.download-pdf-text{
    display: inline-flex;
}
.download-pdf-text:before{
    content: '';
    border-right: 2px solid #123a89;
    border-top: 2px solid #123a89;
    transform: rotate(45deg);
    height: 7px;
    width: 7px;
    display: inline-block;
    margin-right: .7em;
    margin-bottom: .2em;
    align-self: center;
}
.no-mar-top{
    margin-top: 0;
}
.content-aboutus{
    margin-left: 2em;
    width: 71%;
    float: right;
}
.title-about-page h1{
    font-size: 20px;
    text-align: left;
    font-weight: normal;
    margin: 0 0 1.3em;
}

/*sidebar menu*/
.text-vertical.active{
    background-color: #0f3587;
    color: #ffffff;
}
.text-vertical.active p{
    color: #ffffff;
}
.text-vertical.active:after{
    border-right-color: #ffffff;
    border-top-color: #ffffff;
}
.sidebar-about-index{
    display: block;
    padding-right: 3em;
    padding-top: 1.45em;
    padding-left: 0;
}
.table-text-top-about{
    margin-bottom: 4em;
    margin-top: .5em;
}
.table-about-top{
    border: 1px solid black;
    border-collapse: collapse;
    width: 100%;
}
.text-list{
    display: flex;
    margin-top: 0.5em;
    margin-bottom: 1.5em;
    align-items: flex-start;
    align-content: flex-start;
}
.about-index-page .desc-partner-2 .text-list{
    margin-bottom: .5em;
}
.text-list2{
    margin-top: 0.5em;
    margin-bottom: 1.5em;
    align-items: flex-start;
    align-content: flex-start;
    display: flex;
    width: 100%;
}
span.box-arrow{
    border: 1px solid;
    padding: 0.5em 1em;
    margin-right: 0.5em;
    font-size: 13px;
}
.desc-three-pilars{
    display: inline-flex;
    align-self: center;
    font-size: 18px;
}
.three-pilars{
    margin-bottom: 3em;
}
.blue-box-about{
    background-color: #E5F1F8;
    opacity: 0.8;
    margin-bottom: 2em;
}
.title-about{
    color: #000000;
    font-weight: bold;
    font-size: 16px;
    padding: 0 1em;
}
.text-list-bbox{
    padding: 0 1em;
}
.image-about{
    padding: 0 0 0 2em;
    margin-top: 1em;
}
.about-partner .parter-desc{
    border-bottom: none;
}
.about-partner td{
    border: none;
    padding: 0;
}
.flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
.parter-desc.content {
    border-bottom: none;
    width: 50%;
    display: none;
}
.parter-desc:nth-child(odd){
    padding-right: 1em;
}
.parter-desc:nth-child(even){
    padding-left: 1em;
}
.support-partner ul{
    list-style-type: disclosure-closed;
    font-size: 16px;
    align-items: baseline;
    color: #003884;
}
/*.support-partner ul{
    padding-inline-start: 20px;
}
.support-partner ul li{
    padding-bottom: 1em;
}
.support-partner ul a{
    color: #003884;
    text-decoration: underline;
    margin-right: 1em;
    padding-left: 0.5em;
}
.support-partner ul li span{
    border-left: 2px solid #c8c8c8;
    padding-left: 1.5em;
    font-weight: normal;
    margin-top: 0.5em;
    font-size: 18px;
    color: #222222;
}*/
.partner-list-top{
    border-top: 1px solid #969696;
}
.partner-list-bottom{
    border-bottom: 1px solid #969696;
}
.contact-about{
    border: 1px solid #003884;
    display: flex;
    padding: 1em 0em;
    align-items: center;
    justify-content: center;
    margin-top: 2.5em;
    margin-bottom: 5em;
    position: relative;
}
.contact-about p{
    color: #000000;
}
.phone-icon{
    width: 5%;
    margin-right: 0.5em;
}
.phone-number{
    font-weight: bold;
    text-decoration: underline;
    font-size: 18px;
}
.display-flex-PConly{
    display: flex;
}

.blue-box-about{
    background-color: #E5F1F8;
    opacity: 0.8;
    margin-bottom: 2em;
}
.title-about{
    color: #000000;
    font-weight: bold;
    font-size: 16px;
    padding: 0 1em;
}
.text-list-bbox{
    padding: 0 1em;
}
.image-about{
    padding: 0 0 0 2em;
    margin-top: 0.5em;
}
.image-abouts{
    padding: 0 0 0 2em;
    margin-top: 1em;
}
.about-partner .parter-desc{
    border-bottom: none;
}
.about-partner td{
    border: none;
    padding: 0;
}
.flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
}
.parter-desc.content {
    border-bottom: none;
    width: 50%;
    display: none;
}
.parter-desc:nth-child(odd){
    padding-right: 1em;
}
.parter-desc:nth-child(even){
    padding-left: 1em;
}
.support-partner ul{
    list-style-type: disclosure-closed;
    font-size: 16px;
    align-items: baseline;
    color: #003884;
}
/*.support-partner ul{
    padding-inline-start: 20px;
}
.support-partner ul li{
    padding-bottom: 1em;
}
.support-partner ul a{
    color: #003884;
    text-decoration: underline;
    margin-right: 1em;
    padding-left: 0.5em;
}
.support-partner ul li span{
    border-left: 2px solid #c8c8c8;
    padding-left: 1.5em;
    font-weight: normal;
    margin-top: 0.5em;
    font-size: 18px;
    color: #222222;
}*/
.partner-list-top{
    border-top: 1px solid #969696;
}
.partner-list-bottom{
    border-bottom: 1px solid #969696;
}
.contact-about{
    border: 1px solid #003884;
    display: flex;
    padding: 1em 0em;
    align-items: center;
    justify-content: center;
    margin-top: 2.5em;
    margin-bottom: 5em;
    position: relative;
}
.contact-about p{
    color: #000000;
}
.phone-icon{
    width: 5%;
    margin-right: 0.5em;
}
.phone-number{
    font-weight: bold;
    text-decoration: underline;
    font-size: 18px;
}
.phone-number a{
    color: #000000;
    font-weight: bold;
}
.display-flex-PConly{
    display: flex;
}

/*about - report page*/
.report{
    margin-bottom: 3em;
}
.desc-report{
    margin-bottom: 1em;
}
.desc-report p{
    line-height: 1.6em;
    margin-top: .5em;
}
.table-business-report-div .ui-grid .ui-grid-row {
    align-items: center;
    letter-spacing: normal;
    font-size: 14px;
    color: #222222;
    height: auto;
    border: 1px solid #c8c8c8;
}
.table-business-report-div .ui-panelgrid .ui-grid-row .ui-panelgrid-cell{
    padding: 2em;
}
.table-business-report-div .ui-panelgrid .ui-grid-row .ui-panelgrid-cell:last-child{
    border-left: 1px solid #c8c8c8;
}
.table-business-report-div .ui-panelgrid .ui-grid-row {
    border-top: none !important;
}
.table-business-report-div .ui-panelgrid .ui-grid-row:first-child {
    border-top: 1px solid #c8c8c8 !important;
}
.table-business-report-div .report-title{
    border-left: 2px solid #c8c8c8;
    padding: .3em 0 .3em 1.5em;
    margin-bottom: 1.5em;
}
.table-business-report-div .report-title h3{
    margin-top: 0;
    margin-bottom: .3em;
    font-weight: normal;
    font-size: 18px;
}
.table-business-report-div .report-title p{
    margin: 0;
    font-size: 14px;
    color: #787878;
}
.table-business-report-div .list-pdf a{
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
    color: #222222;
    padding-bottom: 1px;
    border-bottom: 1px solid;
    font-size: 16px;
}
.table-business-report-div .list-pdf a:hover{
    opacity: .5;
    transition: 500ms ease 0s;
}
.table-business-report-div .list-pdf ul{
    margin-top: .7em;
    padding-left: 1.2em;
    list-style: none;
}
.table-business-report-div .list-pdf li{
    margin-top: 1.5em;
}
.table-business-report-div .list-pdf li:before {
    content: "";
    height: .5em;
    width: .5em;
    left: -1.2em;
    top: 1em;
    position: relative;
    display: block;
    clip-path: polygon(0 100%, 0 0, 95% 50%);
    -webkit-clip-path: polygon(0 100%, 0 0, 95% 50%);
    background: #0f3587;
}
.table-business-report-div .list-pdf .icon-pdf{
    margin-left: 1em;
    width: 20px;
}

/*about activity css*/
.activity-links-wrap {
    display: inline-block;
    margin: 0 auto 1em;
}
.activity-link {
    position: relative;
    margin-right: 1em;
    display: inline-block;
    word-break: keep-all;
}
.activity-link p {
    font-size: 15px;
    margin: auto 0 2em;
    padding: 0 30px 0 5px;
    border-bottom: 1px solid #123a89;
}
.activity-link p::after {
    width: 12px;
    height: 12px;
    box-shadow: -2px 2px 0 #123a89;
    transform: rotate(315deg);
    position: absolute;
    content: "";
    right: 3px;
    top: 2px;
}
.about-event .lightblue-bg h3 {
    font-size: 16px;
    line-height: 1.6;
}
.about-hrd p, .class-activ p, .about-event p, .about-contest p, .about-social-act p {
    line-height: 1.6em;
    margin-top: .5em;
}
.class-activ, .about-hrd, .about-publication {
    margin-bottom: 2em;
}
.about-event, .about-contest, .about-social-act {
    margin-bottom: 3em;
}
.about-article .about-sub-ttl h3 {
    font-weight: normal;
    border-left: 1px solid #c8c8c8;
    padding-left: 1em;
    padding-top: 2px;
    padding-bottom: 2px;
    margin-top: 1em;
    font-size: 18px;
}
.about-sub-ttl {
    padding-left: 0;
    padding-top: 2px;
    padding-bottom: 2px;
    margin-top: 2em;
}
.about-sub-ttl h3 {
    font-weight: normal;
    margin: 0 auto;
    font-size: 18px;
    border-left: 1px solid #c8c8c8;
    padding-left: 1em;
}
.about-article p.bold-text {
    margin-top: 1.5em;
}
.about-event .lightblue-bg, .about-contest .lightblue-bg, .about-social-act .lightblue-bg {
    margin-top: 1em;
    margin-bottom: 1em;
    padding: 1em 3em;
}

/*about history css*/
.about-history {
    margin-bottom: 1em;
}
.about-history h2 {
    opacity: 0.6;
    font-family: "Kozuka Mincho Pr6N";
    font-size: 21px;
    margin-top: 0;
}
.about-history p {
    border-left: 2px solid #c8c8c8;
    padding-left: 1.5em;
    margin-bottom: 2em;
}
.anniv50{
    display: flex;
    justify-content: center;
    padding: 3em 0;
}
.about-history .history-img{
    padding-right: 2em;
}
.about-history .history-text{
    padding: 0 1em;
}
.history-img img{
    padding-top: 5px;
}
.blue-box-history {
    background-color: #E5F1F8;
    opacity: 0.8;
    margin-bottom: 3em;
}
.blue-box-history p.Topic{
    font-size: 18px;
    color: #222222;
    padding: 1em 2.5em;
    margin-bottom: 0
}
.blue-box-history p.note-text{
    padding: 1em 2.5em;
    font-size: 16px;
    color: #222222;
    margin-top: 0;
}
.button-history{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-inline-start: 3em;
    margin-bottom: 1em;
}
.history-desc{
    padding-bottom: 1em;
    margin-bottom: 1em;
    border-bottom: 1px dotted #969696;
}
.history-desc h3{
    border-left: 2px solid #c8c8c8;
    padding-left: 1.5em;
    font-weight: normal;
    margin-top: 0.5em;
    font-size: 18px;
}
.history-desc img {
    padding-right: 2em;
    margin-top: 0.5em;
}
.history-desc2{
    padding-bottom: 2em;
    margin-bottom: 1em;
}
.history-desc2 h3{
    border-left: 2px solid #c8c8c8;
    padding-left: 1.5em;
    font-weight: normal;
    margin-top: 0.5em;
    font-size: 18px;
}
.history-desc2 img {
    padding-right: 2em;
    margin-top: 0.5em;
}

/*about organization css*/
img.structure-img {
    width: 100%;
}
.about-organization {
    margin-top: 1em;
    margin-bottom: 3em;
}
.about-org-member {
    margin-bottom: 3em;
}
.about-org-member table {
    margin-top: 1em;
    width: 100%;
}
.about-org-member table th {
    font-weight: normal;
    background-color: #f4f4f4;
    border: 1px solid #cacaca;
    padding: 1em 2em;
}
.about-org-member table td {
    border: 1px solid #cacaca;
    padding: 1em 2em;
    word-break: keep-all;
}
.about-org-member table td.right-tab{
    word-break: break-word;
}
.about-org-member table th.left-tab, .about-org-member table td.left-tab {
    text-align: left;
    vertical-align: top;
    width: 140px;
}
.about-org-member table tr td p.text-tb{
    margin-top: 0;
    margin-block-end: 0.5em;
}
.about-org-member table tr td p.text-tb-end{
    margin-top: 0;
    margin-block-end: 0em;
}

/*  about/partner page  */
.h100{
    height: 100%;
}
.desc-partner-1 h3, .desc-partner-2 h3{
    border-left: 2px solid #c8c8c8;
    padding-left: 1.5em;
    font-weight: normal;
    margin-top: 0.5em;
    font-size: 18px;
}
.partner-table{
    width: 20%;
}
.hanamaka-width-table{
    width: 45%;
}
.hanamaka-width{
    width: 55%;
}
.logo-partner{
    text-align: center;
    border-right: 1px solid #c8c8c8;
    border-bottom: 1px solid #c8c8c8;
    width: 20%;
    height: 100px;
    justify-content: center;
    display: flex;
    align-items: center;
    padding: 1.2em;
}
.logo-partner a:hover {
    opacity: .6;
    transition: 500ms ease 0s;
}
.table-partner{
    margin: 2em .5em 4em 0;
    border-left: 1px solid #c8c8c8;
    border-top: 1px solid #c8c8c8;
}
.about-index-page .table-partner {
    margin: 2em 0.5em 2em 0;
}
.logo-wrap{
    width: 27%;
    padding: 1em 1em .3em 0;
}
.parter-desc {
    padding-bottom: 2em;
    margin-bottom: 1em;
    border-bottom: 1px dotted #969696;
}
.parter-desc p{
    margin-bottom: .7em;
}
.parter-desc a{
    text-decoration: underline;
    color: #0f3587;
}
.parter-desc a:hover{
    opacity: .6;
    transition: 500ms ease 0s;
}
.desc-partner-2{
    margin-top: 1em;
}
.desc-partner-2 .link-partner-association a{
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
    color: #0f3587;
    padding-bottom: 1px;
    border-bottom: 1px solid;
    font-size: 16px;
}
.desc-partner-2 .link-partner-association a:hover{
    opacity: .6;
    transition: 500ms ease 0s;
}
.desc-partner-2 .link-partner-association ul{
    margin-top: .7em;
    padding-left: 1.2em;
    list-style: none;
}
.desc-partner-2 .link-partner-association li:before {
    content: "";
    height: .5em;
    width: .5em;
    left: -1.2em;
    top: 1em;
    position: relative;
    display: block;
    clip-path: polygon(0 100%, 0 0, 95% 50%);
    -webkit-clip-path: polygon(0 100%, 0 0, 95% 50%);
    background: #0f3587;
}
.desc-partner-2 .link-partner-association li:first-child{
    margin: 2em 0 1.5em;
}
.desc-partner-2 .link-partner-association li{
    margin: 0 0 1.5em;
}
.desc-partner-2 .link-partner-association .link{
    display: flex;
    align-items: center;
}
.desc-partner-2 .link-partner-association .link p{
    line-height: 1.3em;
    color: #787878;
    margin: 0;
    border-left: 2px solid #c8c8c8;
    margin-left: 1em;
    padding-left: 1em;
}
.about-index-page .desc-partner-2 .link-partner-association li:first-child{
    margin: 1em 0 1.5em;
}

/* about category page */
.category-about-desc{
    margin-top: 0.3em;
}
.img-category{
    width: 100%;
}
.txt-category{
    margin: .7em 0 1em;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.txt-category p{
    line-height: 1.2em;
    margin: 0;
}
.txt-category a:hover{
    opacity: .6;
    transition: 500ms ease 0s;
}
.txt-category .eng-txt{
    color: #787878;
    font-size: 12px;
}
.txt-category .arrow {
    min-width: 22px;
    width: 30px;
    height: 30px;
    background-color: #aa7b53;
    position: relative;
}
.txt-category .arrow::before {
    content: '';
    width: 8px;
    height: 8px;
    border-top: 1px solid #ffffff;
    border-right: 1px solid #ffffff;
    transform: rotate(45deg);
    position: absolute;
    left: 9px;
    top: 11px;
}
.txt-category .sewing .arrow{
    background-color: #1190c6;
}
.txt-category .quilt .arrow{
    background-color: #b06dc8;
}
.txt-category .embroidery .arrow{
    background-color: #f4618e;
}
.txt-category .knit .arrow{
    background-color: #aa7b53;
}
.txt-category .lace .arrow{
    background-color: #66bfd9;
}
.txt-category .paint .arrow{
    background-color: #2ecaa0;
}
.txt-category .handwoven .arrow{
    background-color: #81b32d;
}
.txt-category .leather .arrow{
    background-color: #ffb401;
}
.txt-category .calligraphy .arrow{
    background-color: #c9a966;
}
.txt-category .other .arrow {
    background-color: #ed8e60;
}
.txt-category .other{
    background-color: #adadad;
}
.list-category{
    margin-top: 3em !important;
}
.list-category .categories{
    padding-right: 1em;
    margin-bottom: 1em;
}
.list-category a:hover .categories {
    opacity: 0.5;
}
.dis-PC{
    display: block;
}
.dis-SM{
    display: none;
}

.about-index-page .hanamaka-width{
    width: 45%;
}
.parter-desc .bernina-text{
    margin-bottom: 12em
}

@media screen and (max-width: 1265px) {
    .sidebar-about-index {
        padding-right: 1em;
    }
}

/*about article list*/
.about-article {
    margin-bottom: 1em;
}
.article-list-top {
    padding-left: 38px;
}
.article-list-top p {
    text-indent: -38px;
}
.article-list-top span {
    color: #ffffff;
    background-color: #bfbfbf;
    padding: 7px 10px;
    margin-right: 0.7em;
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
}
.about-article ol {
    padding-inline-start: 4em;
}
.about-article li {
    color: #222222;
    font-size: 16px;
}
.about-article ol li ul.sub-list {
    text-indent: -18px;
    padding-inline-start: 20px;
}

.how-to-learn .title-about-page {
    padding-left: 0;
    padding-right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.list-category .categories a:hover img {
    opacity: .7;
    transition: 500ms ease 0s;
}

@media only screen and (max-width: 1280px) {
    .download-pdf-text:before{
        margin-bottom: .1em;
    }
}
/*ipad pro*/
@media only screen and (max-width: 1024px) {
    .content-aboutus {
        width: 71%;
    }
    .download-pdf-text:before{
        margin-bottom: .2em;
    }
    .box-number{
        margin-top: 5px;
    }
    .table-about-top td.left-about-top {
        max-width: 100px;
    }
    /*sidebar menu*/
    .sidebar-about-index {
        padding-right: .5em;
    }

    /*about history css*/
    .about-history {
        margin-bottom: 0.5em;
    }

    /*  about/partner page  */
    .logo-partner{
        height: 80px;
    }
}

/*ipad*/
@media only screen and (max-width: 768px) {
    .ipad-btn-position {
        display: grid;
    }
    .ipad-btn-position button {
        margin-top: 50px;
    }
    .show-pc-about {
        display: none;
    }
    .show-mobile-about {
        display: flex;
    }

    /*about slide top*/
    .about-top-slide {
        margin: 1em auto 0;
    }

    /*about index*/
    .page-ttl.about h1 {
        font-family: "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
        font-weight: normal;
        font-size: 28px;
        margin: 0 auto 0.5em;
    }
    .download-pdf-text:before{
        margin-bottom: .2em;
    }
    .about-index-page{
        display: flex;
        flex-direction: column-reverse;
    }
    .content-aboutus {
        width: 100%;
        margin-left: 0;
        margin-top: 1em;
        padding: 0;
    }
    .content-aboutus.report{
        margin-top: 0;
        margin-bottom: 1.5em;
    }
    .sidebar-about-index{
        width: 100%;
        padding: 2em 0.5em 3.5em;
    }
    .text-vertical{
        padding-left: 2em;
    }
    .aboutus-bottom{
        width: 100%;
        padding-bottom: 2em;
    }
    .sidebar-about-index-mobile {
        margin-top: 0.5em;
        margin-bottom: 1.5em;
    }
    a.link-menu-about {
        margin-left: 15px;
    }
    a.link-menu-about:first-of-type {
        margin-left: 55px;
        margin-right: 0;
    }
    a.link-menu-about:last-of-type {
        margin-left: 15px;
        margin-right: 55px;
    }
    .text-vertical-mobile {
        padding: 0.5em 1em;
        border: 1px solid #123a89;
        border-left: 1px solid #123a89;
        border-top: 1px solid #123a89;
    }
    .text-vertical-mobile.active {
        background-color: #0f3587;
        color: #ffffff;
    }
    .text-vertical-mobile.active p {
        color: #ffffff;
        text-align: center;
        word-break: keep-all;
    }
    .text-vertical-mobile p {
        text-align: center;
        word-break: keep-all;
    }
    .text-vertical-mobile:after {
        display: none;
    }
    .margintop-sm-about{
        margin-top: 2em;
    }

    /*about article list*/
    .about-article {
        margin-bottom: 1.5em;
    }

    /*about history*/
    .about-history {
        margin-bottom: 1.5em;
    }

    /*about organization css*/
    img.structure-img {
        width: 100%;
    }
    .about-org-member {
        margin-bottom: 3em;
    }

    /*about reports*/
    .table-business-report-div {
        margin-bottom: 1.5em;
    }

    /*about partner page*/
    .partner{
        padding-left: 0;
        margin-bottom: 1.5em;
    }
    .desc-partner-1{
        padding-left: 0;
    }
    .desc-partner-2{
        padding-left: 0;
    }
    .desc-partner-1 h3 {
        margin-top: 0.5em;
    }
    .display-flex-PConly{
        display: block;
    }
    .contact-about{
        display: block;
    }
    .contact-about .contact-note {
        text-align: center;
    }

}

/* Smartphone */
@media screen and (max-width: 40.063em) {
    /*about slide top*/
    .margintop-sm-about{
        margin-top: 2em;
    }
    .about-top-slide {
        margin: 1em auto 0;
    }
    .about-top-slide .animation {
        height: 295px !important;
    }
    .download-pdf-text:before{
        margin-bottom: .2em;
    }

    .table-about-top td.left-about-top {
        max-width: 113px;
    }
    .table-about-top td.right-about-top {
        max-width: 180px;
    }


    /*sidebar menu*/
    .table-text-top-about{
        margin-bottom: 2em;
    }
    .sidebar-about-index{
        padding: 1em 0;
    }
    .about-index-page{
        padding-left: 0;
        padding-right: 0;
        padding-top: 0;
    }
    .title-about-page {
        padding-left: 0;
        padding-right: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }
    .title-about-page h1 {
        font-size: 20px;
        text-align: center;
    }
    .table-about-top, th, td{
        padding: 1em ;
        min-width: fit-content;
    }
    .table-about-top td:first-child{
        word-break: keep-all;
    }
    .content-aboutus{
        margin-top: 1em;
        margin-bottom: 2em;
    }
    .title-about p{
        margin-bottom: 0;
    }
    .three-pilars{
        margin-bottom: 0.5em;
    }
    a.link-menu-about {
        margin-left: 10px;
    }
    a.link-menu-about:first-of-type {
        margin-left: 15px;
        margin-right: 0;
    }
    a.link-menu-about:last-of-type {
        margin-left: 10px;
        margin-right: 15px;
    }

    /*about history css*/
    .about-history h2 {
        text-align: center;
    }
    .anniv50 {
        display: flex;
        justify-content: center;
        padding: 1.5em 0;
    }
    .history-img img {
        padding-bottom: 1em;
    }
    .about-history .history-img {
        padding-right: 0em;
    }
    .about-history .history-text {
        padding: 0;
    }

    /*about activity css*/
    .activity-links-wrap {
        display: flex;
        flex-wrap: wrap;
        column-count: 2;
        -webkit-column-count: 2;
        -moz-column-count: 2;
        margin: 0 auto;
    }
    .activity-links-wrap .activity-link:nth-child(odd) {
        margin-right: .5em;
    }
    .activity-links-wrap .activity-link:nth-child(even) {
        margin-left: .5em;
    }
    .activity-link {
        margin-right: 0;
        width: calc(50% - .5em)
    }
    .activity-link p {
        font-size: 14px;
        margin: auto 0 1em;
        padding: 0px 20px 0 0;
        border-bottom: 1px solid #123a89;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        /*width: 155px;*/
    }
    .activity-link p::after {
        width: 9px;
        height: 9px;
    }
    .about-event .lightblue-bg, .about-contest .lightblue-bg, .about-social-act .lightblue-bg {
        padding: 1em 1.5em;
    }
    .about-topmargin-sm {
        margin-top: -1em;
    }
    h3.about-sub-ttl {
        margin-top: 1em;
    }
    .class-activ, .about-hrd, .about-publication {
        margin-bottom: 1em;
    }
    .about-event, .about-contest, .about-social-act {
        margin-bottom: 1em;
    }
    .about-sub-ttl {
        padding-left: 0;
        padding-top: 2px;
        padding-bottom: 2px;
        margin-top: 2em;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .about-sub-ttl h3 {
        font-weight: normal;
        margin: 0 auto;
        font-size: 18px;
        border-left: 1px solid #c8c8c8;
        padding-left: 1em;
    }

    /* page about/report */
    .table-business-report-div .ui-panelgrid .ui-grid-row .ui-panelgrid-cell{
        border: 1px solid #c8c8c8;
        border-top: none;
    }
    .table-business-report-div .ui-panelgrid .ui-grid-row:first-child{
        border-top: 1px solid #c8c8c8;
    }

    /*page about partner*/
    .logo-partner{
        width: 33.3333%;
        height: 100px;
    }
    .width-sm{
        width: 80%;
    }
    .hanamaka-width-table {
        width: 35%;
    }
    .hanamaka-width {
        width: 45%;
    }
    .logo-wrap {
        width: 60%;
    }
    .table-partner{
        margin-bottom: 2em;
        margin-right: 0;
    }
    .desc-partner-2 h3{
        margin-top: 0;
    }
    .desc-partner-2 .link-partner-association li:first-child,
    .desc-partner-2 .link-partner-association li{
        margin-bottom: 1em;
    }
    .desc-partner-2 .link-partner-association li:first-child {
        margin-top: 1em;
    }

    .display-flex-PConly{
        display: block;
    }
    .contact-about{
        display: block;
    }
    .contact-about .contact-note {
        text-align: center;
    }
    .parter-desc:nth-child(even){
        padding-left: 0em;
    }

    /* about category page */
    .list-category .categories:nth-of-type(odd){
        padding: 7px;
        margin-bottom: 0;
        padding-left: 0;
    }
    .list-category .categories:nth-of-type(even){
        padding: 7px;
        margin-bottom: 0;
        padding-right: 0;
    }
    .list-category {
        margin-top: 0 !important;
        padding: 7px 0;
    }
    .txt-category {
        margin: .7em 0 0;
    }
    .category-about {
        margin-bottom: 1.5em;
    }
        .dis-PC{
        display: none;
    }
    .dis-SM{
        display: block;
    }
    .div-box-arrow{
        margin-top: 0;
        flex-wrap: wrap;
        display: flex;
    }
    .div-box-arrow span.box-arrow{
        margin-bottom: 5px;
    }
    .about-index-page .text-list{
        margin-top: 0;
    }
    img.w100.dis-SM{
        margin-bottom: 2em;
    }


    /*about organization css*/
    .about-organization {
        margin-bottom: 1em;
    }
    .about-org-member {
        margin-bottom: 3.2em;
    }
    .about-org-member table th.left-tab, .about-org-member table td.left-tab {
        text-align: left;
        vertical-align: top;
        width: 110px;
    }

    /*about article css*/
    .about-article {
        margin-top: 0.5em;
    }

    .category-about .txt-category p {
        font-size: 13px;
    }
    .dis-PC{
        display: none;
    }
    .dis-SM{
        display: block;
    }
    .div-box-arrow{
        margin-top: 0;
        flex-wrap: wrap;
        display: flex;
    }
    .div-box-arrow span.box-arrow{
        margin-bottom: 5px;
    }
    .about-index-page .text-list{
        margin-top: 0;
        margin-bottom: .5em;
    }
    img.w100.dis-SM{
        margin-bottom: 2em;
    }

    .box-number{
        font-size: 20px;
    }
    .desc-three-pilars {
        display: inline-flex;
        align-self: center;
        font-size: 20px;
    }
    .text-list2 {
        margin-top: 1em;
        margin-bottom: 1em;
        align-items: flex-start;
        align-content: flex-start;
    }
    .parter-desc.content {
        width: 100%;
        border-bottom: 1px dotted #969696;
    }
    .about-index-page .link-partner-association.left {
        padding-left: 0em;
    }
    .parter-desc .bernina-text{
        margin-bottom: -.9em
    }
    .contact-about .blue-btn{
        padding: 1em 2em;
    }
}

@media screen and (max-width: 425px) {
    .logo-partner{
        height: 80px;
    }
    .width-sm{
        width: 100%;
    }
    .hanamaka-width-table {
        width: 45%;
    }
}