@charset "UTF-8";
/************************************
component
************************************/
@media screen and (max-width:1300px) {

  .index_bg img{
    width: 50%;
  }

}



@media screen and (max-width:1100px) {

  #index .index_bg.pc{
    display: none;
  }

  #index .index_bg.sp{
    display: block;
  }

  .index_bg img{
    position: static;
    height: auto;
    width: 100%;
    max-width: 100%;
  }

  #index #member_related{
    width: 50%;
    height: auto;
  }

  #index #member_related .inner_member_related{
    width: 100%;
  }

  #index #member_related .txt_field input{
    width: 100%;
  }




}

@media screen and (max-width:1024px) {




}


@media screen and (max-width:768px) {

  /************************************
  base
  ************************************/
  .sp {
    display: block;
  }
  .pc {
    display: none;
  }

  .popup_window .popup_content{
    width: 80%;
    padding: 10%;
  }
  /************************************
  header
  ************************************/
  .spnavButton {
  	position: absolute;
  	width: 40px;
  	height: 40px;
  	top: 10px;
  	right: 10px;
  	z-index: 9999;
  }
  .spnavButton span {
  	position: absolute;
  	right: 10px;
  	width: 20px;
  	height: 2px;
  	border-radius: 1px;
  	transition: all .4s;
  	background: #082B4B;
  }
  .spnavButton span:nth-of-type(1) {
  	top: 11px;
  }
  .spnavButton span:nth-of-type(2) {
  	top: 18px;
  }
  .spnavButton span:nth-of-type(3) {
  	top: 25px;
  }
  .spnavButton-active span:nth-of-type(1) {
  	-webkit-transform: translateY(6px) rotate(-45deg);
  	transform: translateY(6px) rotate(-45deg);
  }
  .spnavButton-active span:nth-of-type(2) {
  	opacity: 0;
  }
  .spnavButton-active span:nth-of-type(3) {
  	-webkit-transform: translateY(-8px) rotate(45deg);
  	transform: translateY(-8px) rotate(45deg);
  }

  nav.globalnav{
    display: none;
  }

  nav.globalnav {
  	display: none;
  	width: 100%;
  	height:100%;
  	position: absolute;
  	top: 0;
  	right: 0;
  	/* background: rgba(0,0,0,0.7); */
    background: transparent;
  	z-index: 999;
  }

  nav.globalnav ul.globalnav__list {
  	position: absolute;
  	top: 60px;
  	right: 0;
  	/* -webkit-transform: translateY(-50%) translateX(-50%);
  	transform: translateY(-50%) translateX(-50%); */
  	width: 50%;
  	background: #fff;
  	padding: 20px;
    display: block;
    box-shadow: 1px 3px 3px #eee;
  }

  nav.globalnav li{
    width: 100%;
    height: auto;
    text-align: left;
    border-bottom: 1px solid #E9EBEF;
    padding-bottom: 10px;
  }

  nav.globalnav li:first-child::before{
    display: none;
  }

  nav.globalnav li::after{
    display: none;
  }

  nav.globalnav li a{
    color: #333;
  }

  nav.globalnav li a br{
    display: none;
  }

  nav.globalnav li:nth-of-type(2) a, nav.globalnav li:nth-of-type(3) a{
    margin-top: 10px;
  }

  .logo_content{
    width: 90%;
  }

  .head_content{
    width: 90%;
  }

  .head_icon ul.head_icon_wrap{
    margin: 0 30px 10px 0;
  }
  /************************************
  main
  ************************************/
  #index #member_related{
    width: 90%;
    height: auto;
  }

  #index #member_related .inner_member_related{
    width: 100%;
  }

  #index #member_related .txt_field input{
    width: 100%;
  }

  .index_bg img{
    position: static;
    width: 100%;
    max-width: 100%;
    height: auto;
  }
  /************************************
  パスワードを忘れた方
  ************************************/







  /************************************
  パスワード再設定
  ************************************/



  /************************************
  マイページ
  ************************************/
  #mypage .mypage_content_wrap{
    display: block;
  }

  #mypage .mypage_head{
    width: 100%;
    margin-bottom: 20px;
  }

  #mypage .mypage_content{
    width: 100%;
  }

  #mypage .mypage_column .archive_column li .column_img{
    width: 30%;
  }

  #mypage .mypage_column .archive_column li .column_content{
    width: 65%;
  }

  #mypage .archive_video li{
    width: 31%;
  }

  #mypage .archive_video li .video_item iframe{
    height: 130px;
  }

  #mypage .mypage_edit .mypage_edit_content_wrap .mypage_edit_content{
    width: 100%;
  }
  /************************************
  会員情報変更、パスワード変更
  ************************************/




  /************************************
  ログアウト
  ************************************/





  /************************************
  input関連
  ************************************/




  /************************************
  ページ共通
  ************************************/
  #page{
    padding: 50px 0 20px;
  }

  .content_inner{
    width: 90%;
  }
  /************************************
  契約書
  ************************************/
  #contract .contract_table .table .thead_th{
    padding: 0 5px 10px 5px;
  }

  #contract .contract_table .table .thead_th:nth-of-type(1){
    width: 250px;
  }

  #contract .contract_table .table .thead_th:nth-of-type(2){
    width: 140px;
  }

  #contract .contract_table .table .thead_th:nth-of-type(3){
    width: 140px;
  }

  #contract .contract_table .table .thead_th:nth-of-type(4){
    width: 140px;
  }

  #contract .contract_table .table .tbody_tr .tbody_td:first-child{
    width: 250px;
  }

  #contract .contract_table .table .tbody_tr .tbody_td{
    width: 140px;
    padding: 5px;
  }

  #contract .contract_table .table .tbody_tr .contract_edit_btn{
    top: 10px;
  }
  /************************************
  ダウンロードコンテンツ
  ************************************/
  #dlc .dlc_sort_content input.search_input{
    width: 585px;
  }

  #dlc .dlc_table .table .thead_th{
    padding: 0 5px 10px 5px;
  }

  #dlc .dlc_table .table .thead_th:nth-of-type(1){
    width: 300px;
  }

  #dlc .dlc_table .table .thead_th:nth-of-type(2){
    width: 200px;
  }

  #dlc .dlc_table .table .thead_th:nth-of-type(3){
    width: 200px;
  }

  #dlc .dlc_table .table .tbody_tr .tbody_td:first-child{
    width: 300px;
  }

  #dlc .dlc_table .table .tbody_tr .tbody_td{
    width: 200px;
    padding: 5px;
  }
  /************************************
  アーカイブ共通
  ************************************/
  .page_content_l{
    float: none;
    width: 100%;
  }

  .subside{
    float: none;
    width: 100%;
    margin-top: 30px;
  }
  /************************************
  動画コンテンツ
  ************************************/
  #video .archive_video li{
    width: 31%;
  }

  #video .archive_video li .video_item iframe{
    height: 130px;
  }

  #video .single_video iframe{
    height: 390px;
  }

  #video .video_thumbnail img, #mypage .video_thumbnail img{
    width: 100%;
    height: 130px;
  }
  /************************************
  コラム
  ************************************/
  #column .page_content_l .archive_column li .column_img{
    width: 30%;
  }

  #column .page_content_l .archive_column li .column_content{
    width: 65%;
  }
  /************************************
  QA
  ************************************/
  #qa .qa_search_wrap input.search_input{
    width: 87%;
  }
  /************************************
  法律相談
  ************************************/
  #form .form_content{
    width: 100%;
  }
  /************************************
  通知
  ************************************/





  /************************************
  お知らせ
  ************************************/




  /************************************
  breadcrumbs
  ************************************/






  /************************************
  footer
  ************************************/


















}



@media screen and (max-width:480px) {

  /************************************
  base
  ************************************/


  .popup_window .popup_content{
    width: 90%;
  }

  .popup_window .popup_content p{
    font-size: 16px;
    margin-bottom: 10px;
  }

  .popup_window .popup_content a{
    font-size: 14px;
  }

  .popup_window .popup_content .popup_close_btn{
    top: 10px;
    right: 20px;
    font-size: 14px;
  }
  /************************************
  header
  ************************************/
  nav.globalnav ul.globalnav__list{
    width: 90%;
  }

  .logo img{
    width: 150px;
  }

  .head_icon ul.head_icon_wrap{
    margin: 0 40px 0 0;
  }

  .head_icon ul.head_icon_wrap .user_content{
    margin-left: 15px;
  }

  ul.notification_menu_list{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 55px;
    border-radius: 0;
  }

  ul.user_menu_list{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 55px;
    border-radius: 0;
  }

  .head_icon ul.head_icon_wrap ul.pop_up_menu li{
    padding: 10px 20px;
  }
  /************************************
  main
  ************************************/
  #index #member_related{
    padding: 40px 0;
  }

  #index #member_related h1{
    margin-bottom: 30px;
    font-size: 20px;
  }
  /************************************
  パスワードを忘れた方
  ************************************/







  /************************************
  パスワード再設定
  ************************************/
  #edit .form_content dt{
    font-size: 16px;
  }

  #edit .form_content dt span{
    margin-left: 15px;
  }
  /************************************
  マイページ
  ************************************/
  #mypage .mypage_head h2{
    font-size: 18px;
  }

  #mypage .mypage_activity li a{
    padding: 10px;
  }

  #mypage .mypage_activity li .activity_txt{
    width: 77%;
  }

  #mypage .mypage_activity li .activity_arrow{
    width: 8%;
  }

  #mypage .mypage_column .archive_column .column_content_wrap{
    display: block;
  }

  #mypage .mypage_column .archive_column li .column_img{
    width: 100%;
  }

  #mypage .mypage_column .archive_column li .column_content{
    width: 100%;
  }

  #mypage .archive_video li{
    width: 100%;
    margin: 0 0 20px 0;
  }

  #mypage .archive_video li .video_item iframe{
    height: 200px;
  }
  /************************************
  会員情報変更、パスワード変更
  ************************************/




  /************************************
  ログアウト
  ************************************/





  /************************************
  input関連
  ************************************/




  /************************************
  ページ共通
  ************************************/
  time{
    font-size: 12px;
  }

  .post_link a{
    font-size: 12px;
  }
  /************************************
  契約書
  ************************************/
  #contract .contract_sort_content_wrap{
    font-size: 12px;
    margin-bottom: 25px;
  }

  .custom-select-trigger:after{
    width: 7px;
    height: 7px;
    right: -15px;
  }

  #contract .contract_sort_content_wrap .contract_sort_r .contract_link{
    margin-right: 0;
  }

  #contract .contract_create_btn .btn{
    display: none;
  }

  #contract .contract_sort_content_wrap .contract_sort_r .contract_create_btn img.create_btn_img{
  	display: block;
    position: fixed;
    top: 50%;
    right: 10px;
    width: 40px;
    height: 40px;
    z-index: 5
  }

  #contract .contract_table .table{
    display: block;
  }

  #contract .contract_table .table .thead{
    display: none;
  }

  #contract .contract_table .table .tbody_tr{
    padding: 15px 5px;
  }

  #contract .contract_table .table .tbody_tr .tbody_td:first-child{
    width: 100%;
  }

  #contract .contract_table .table .tbody_tr .tbody_td{
    width: 100%;
    display: block;
    padding: 0;
  }

  #contract .contract_table .table .tbody_tr .tbody_td:nth-of-type(3){
    margin: 5px 0;
  }

  #contract .contract_table .table .tbody_tr .tbody_td:nth-of-type(4){
    display: none;
  }

  #contract #workspace .contract_table .table .tbody_tr .tbody_td:nth-of-type(4){
    display: block;
  }

  #contract #new h1{
    font-size: 20px;
  }

  #contract #new{
    width: 100%;
  }

  #contract #new p.file_style_txt{
    display: block;
    padding: 15px 0 0;
  }

  #contract #new #newfile_form .acf-file-uploader .hide-if-value a.button{
    display: block;
    text-align: center;
  }

  #contract .file_preview_content_wrap{
    padding: 20px 40px;
  }

  #contract #comment .comment_content_txt{
    width: 80%;
  }
  /************************************
  ダウンロードコンテンツ
  ************************************/
  #dlc .dlc_sort_content input.search_input{
    width: 80%;
  }

  #dlc .dlc_sort_content input[type="submit"]{
    width: 18%;
  }

  #dlc .dlc_sort_content li a{
    font-size: 12px;
  }

  #dlc .dlc_table .table{
    display: block;
  }

  #dlc .dlc_table .table .thead{
    display: none;
  }

  #dlc .dlc_table .table .tbody_tr{
    padding: 15px 0;
  }

  #dlc .dlc_table .table .tbody_td{
    display: block;
    padding: 0;
  }

  #dlc .dlc_table .table .tbody_tr .tbody_td:last-child{
    margin: 0;
    text-align: start;
  }

  #dlc .dlc_detail_content_wrap .dlc_cat_tag li a{
    font-size: 12px;
  }

  #dlc .dlc_detail_content_wrap h1{
    font-size: 20px;
  }

  #dlc .dlc_detail_preview{
    width: 100%;
  }

  #dlc .dlc_detail_table dl{
    display: block;
  }

  #dlc .dlc_detail_table dt{
    width: 100%;
    padding: 10px;
  }

  #dlc .dlc_detail_table dd{
    width: 100%;
    padding: 10px;
  }
  /************************************
  動画コンテンツ
  ************************************/
  .cat_menu ul{
    padding: 10px 0;
  }

  .cat_menu .cat_menu_content_pc{
    display: none;
  }

  .cat_menu .cat_menu_content_sp{
  	display: block;
  }

  .cat_menu .cat_menu_content_sp li.cat_menu_content_ttl{
    position: relative;
    color: #B0B4BA;
  }

  .cat_menu .cat_menu_content_sp li.cat_menu_content_ttl::after{
    position: absolute;
    display: block;
    content: '';
    width: 10px;
    height: 10px;
    top: 50%;
    right: 10px;
    margin-top: -3px;
    border-bottom: 1px solid #B0B4BA;
    border-right: 1px solid #B0B4BA;
    transform: rotate(45deg) translateY(-50%);
    transition: all .4s ease-in-out;
    transform-origin: 50% 0;
  }

  .cat_menu .cat_menu_content_sp li.cat_menu_content_ttl.open::after{
    margin-top: 3px;
    transform: rotate(-135deg) translateY(-50%);
  }

  .cat_menu .cat_menu_content_sp li{
    padding: 10px;
  }

  .cat_menu_content_item{
    display: none;
  }

  .cat_menu ul li.current a{
    padding-bottom: 5px;
  }

  #video .archive_video li{
    width: 100%;
    margin: 0 0 20px 0;
  }

  #video .archive_video li .video_item iframe{
    height: 200px;
  }

  #video .single_video iframe{
    height: 200px;
  }

  #video .video_thumbnail img, #mypage .video_thumbnail img{
    width: 100%;
    height: 200px;
  }

  #video .post_link{
    display: block;
  }

  #video .post_link .prev{
    width: 100%;
    border-right: none;
    border-bottom: 1px solid #E9EBEF;
    padding: 0 0 20px;
  }

  #video .post_link .next{
    width: 100%;
    padding: 20px 0 0;
  }
  /************************************
  アーカイブ共通
  ************************************/
  .pagenavi{
    margin-top: 20px;
  }
  /************************************
  コラム
  ************************************/
  #column .page_content_l .archive_column li .column_content_wrap{
    display: block;
  }

  #column .page_content_l .archive_column li .column_img{
    width: 100%;
  }

  #column .page_content_l .archive_column li .column_content{
    width: 100%;
  }

  #column #ez-toc-container{
    width: 100%;
    padding: 15px;
  }
  /************************************
  QA
  ************************************/
  #qa .qa_search_wrap input.search_input{
    width: 78%;
  }

  #qa .qa_search_wrap input[type="submit"]{
    width: 18%;
  }

  #qa .single_qa{
    padding: 30px 10px;
  }

  #qa .single_qa .single_q_ttl h1{
    font-size: 16px;
  }

  #qa .single_qa .a_content .single_a_ttl h2{
    font-size: 14px;
    width: 85%;
  }

  .cat_time_box{
    display: block;
  }

  .cat_time_box .cat_l{
    margin-bottom: 5px;
  }
  /************************************
  法律相談
  ************************************/
  #form .form_content dt{
    font-size: 16px;
  }

  #form .form_content dt span{
    margin-left: 15px;
  }
  /************************************
  通知
  ************************************/
  #notification .page_content_l .archive_notification li .notification_item{
    padding: 10px;
  }

  #notification .page_content_l .archive_notification li a{
    padding: 10px;
  }

  #notification .page_content_l .archive_notification li h2{
    font-size: 14px;
  }

  #notification .notification_txt{
    padding: 0 10px 10px 10px;
  }
  /************************************
  お知らせ
  ************************************/
  #news .page_content_l .archive_news li a{
    padding: 10px;
  }

  #news .page_content_l .archive_news li h2{
    font-size: 14px;
  }
  /************************************
  breadcrumbs
  ************************************/
  .breadcrumbs span a{
    font-size: 10px;
  }

  .breadcrumbs span{
    font-size: 10px;
  }
  /************************************
  footer
  ************************************/
  .footer_wrap{
    display: block;
  }

  .footer_wrap ul li{
    padding: 0 10px;
  }

  .footer_wrap ul li a{
    font-size: 10px;
  }

  .copyright p{
    margin-top: 10px;
  }

  .footer_wrap .copyright p{
    font-size: 10px;
  }



}







@media screen and (max-width:376px) {



}



@media screen and (max-width:321px){

  .top_back_btn a{
    width: 100%;
  }

  #mypage .mypage_activity li .activity_txt p{
    font-size: 12px;
  }

  #index #member_related #resetpwd .btn a{
    width: 100%;
  }

  #edit .form_content input[type="button"]{
    width: 100%;
  }

  #contract .contract_sort_content_wrap{
    font-size: 10px;
  }

  #contract .contract_sort_content_wrap .contract_sort_l .sort_all{
    margin-right: 10px;
  }

  .custom-select-trigger{
    margin-right: 0;
  }

  .btn input[type="button"]{
    width: 100%;
  }

  .footer_wrap ul li{
    padding: 0 3px;
  }


}