.portfolio-menu button { font-size: 16px; } @media only screen and (min-width: 1120px) and (max-width: 1599px) { .portfolio-menu button { font-size: 14px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .social-sidebar-area, .message-box > a { width: 80px; } .message-box > a { height: 80px; } .social-info-area { left: -160px; } .gallery_area { height: calc(100% - 380px); width: calc(100% - 180px); left: 120px; right: 60px; padding-right: 45px; } .social-sidebar-area { height: 65%; } .social-info-area { left: -25px; bottom: 190px; } .social-info-area > a > span { display: none; } .social-info-area a i { font-size: 14px; margin-right: 10px; } .portfolio-menu button { font-size: 14px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .navbar { padding: 0; } .navbar-toggler { padding: 0; font-size: 20px; background-color: transparent; border: none; border-radius: 6px; width: 120px; height: 35px; color: #fff; line-height: 28px; margin: 38px 0; border: 2px solid #fff; font-weight: 400; } #Menu { padding: 30px; background-color: #1d1d1d; z-index: 1002; } .header-area .main-menu .nav-link { padding: 5px 15px; } .header-search-form form input { width: 570px; margin-bottom: 15px; } .social-sidebar-area, .message-box > a { width: 80px; } .message-box > a { height: 80px; } .social-sidebar-area { bottom: 50px; height: 70%; } .social-info-area { left: -25px; bottom: 190px; } .social-info-area > a > span { display: none; } .social-info-area a i { font-size: 14px; margin-right: 10px; } .slide-text-top { margin-left: 120px; margin-top: -50px; } .slide-text { margin-left: 120px; margin-top: -50px; } .carousel-indicators li { height: 50px; } .slide-text-top span { font-size: 60px; } .slide-text span { font-size: 60px; } .gallery_area { height: calc(100% - 380px); width: calc(100% - 130px); left: 100px; right: 30px; padding-right: 30px; } .portfolio-menu button { font-size:12px; padding: 0 5px; } .counter-area h2 { font-size: 24px; } .counter-area h6 { font-size: 12px; } .elements-title h2 { font-size: 24px; margin-bottom: 50px; } } /*@media only screen and (min-width: 320px) and (max-width: 767px) */ @media only screen and (min-width: 240px) and (max-width: 767px) { p { font-size: 14px; } .navbar { padding: 0; } .navbar-toggler { padding: 0; font-size: 16px; background-color: transparent; border-radius: 6px; width: 90px; height: 30px; color: #fff; line-height: 28px; margin: 20px 0; border: 2px solid #fff; font-weight: 400; } #Menu { padding: 20px; background-color: #1d1d1d; z-index: 1002; } .header-area .main-menu .nav-link { padding: 5px 15px; } .header-search-form form input { width: 570px; margin-bottom: 15px; } .header-area { height: 70px; padding: 0 0; } .navbar-brand { margin-right: 0; /*max-width: 100px;*/ } .header-search-form form input { width: 100%; margin-bottom: 15px; font-size: 10px; } .social-sidebar-area, .message-box > a { width: 50px; } .message-box > a { height: 50px; } .social-sidebar-area { bottom: 40px; } .carousel-indicators li { height: 40px; } .social-info-area { left: -27px; bottom: 130px; } .social-info-area > a > span { display: none; } .gradient-background-overlay, .gradient-background-overlay:before { height: 90px; } .slide-text-top a { font-size: 16px; } .slide-text-top { padding: 15px 15px 10px; margin-left: 65px; margin-top: -40px; } .slide-text a { font-size: 20px!important; } .slide-text { padding: 15px 15px 10px; margin-left: 65px; margin-top: -40px; } .slide-text-top span { font-size: 24px; } .slide-text span { font-size: 24px; } .contact-popup-form .modal-content { padding: 15px; } .business-content h2, .contact-heading-text h2 { /*font-size: 20px;*/ font-size: 16px; } .contact-heading-text h2, .business-content p { margin-bottom: 30px; } .modal-dialog { width: 240px; margin: 30px auto; } .about-content h2 { margin-bottom: 30px; font-size: 20px; } .single-pie-bar { margin-bottom: 50px; } .business-info-area { border-top: 1px solid #dcdcdc; margin-bottom: 0; } .footer-area { position: relative; height: auto; padding: 30px 0 15px; bottom: 0; left: 0; } .single-footer-content { margin-bottom: 15px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .gallery_area { height: auto; width: calc(100% - 90px); overflow-y: auto; position: relative; z-index: 1; top: 100px; left: 60px; right: 15px; padding-right: 15px; } .portfolio-menu button { font-size: 12px; padding: 0 5px; } .gallery_menu { margin-bottom: 30px; } #scrollUp { display: none !important; } .page-item.active .page-link:after { width: 40px; } .page-item.active .page-link { padding-right: 40px; } .pagination-area .page-link { font-size: 14px; } .pagination-area.mb-100 { margin-bottom: 0; } .business-area.mt-100, .about-me-area.mt-100, .contact-area.mt-100 { margin-top: 70px; } .contact-core-info { width: 200px; left: -40px; padding: 15px; } .single-cool-fact { margin-bottom: 30px; } .elements-title h2 { font-size: 20px; margin-bottom: 30px; } .studio-buttons-area .btn { margin-bottom: 15px; } .message-box > a > img { max-width: 30px; } /*  追加  */ .welcome-area { position: relative; z-index: 2; /*width: 100%;*/ height: 100vh !important; } .nav-link{ font-size:1.25em!important;} } @media only screen and (min-width: 480px) and (max-width: 767px) { .modal-dialog { width: 320px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { #scrollUp { display: block !important; } .slide-text-top a { font-size: 20px; } .slide-text-top span { font-size: 36px; } .slide-text span { font-size: 36px; } .slide-text-top a { font-size: 24px; } .slide-text a { font-size: 20px; } .modal-dialog { width: 450px; } .contact-popup-form .modal-content { padding: 50px 15px; } .portfolio-menu button { font-size: 12px; } }