@charset "utf-8";

/*
 * File    : rwd-tools.css
 * Author  : STUDIO-JT (KMS)
 *
 * SUMMARY :
 * 1480px
 * 1200px
 * 860px
 * 540px
 */



/* **************************************** *
 * 1480px
 * **************************************** */
@media (max-width: 1480px){

    /* SOFTWARE & DESIGN TOOLS */
    .tools-introduce { gap: 72rem; }

    .tools-introduce__item-head { grid-template-columns: 220rem 1fr; }
    .tools-introduce__item-summary { padding-top: 62rem; padding-bottom: 62rem; }

    .tools-introduce__item-content { gap: 55rem; padding: 55rem 50rem 55rem 270rem; }

    .tools-introduce__infolist > li > ul > li:before { top: 12rem; }

}



/* **************************************** *
 * 1200px
 * **************************************** */
@media (max-width: 1200px){

    /* SOFTWARE & DESIGN TOOLS */
    .tools-introduce { gap: 62rem; }

    .tools-introduce__item-head { grid-template-columns: 190rem 1fr; }
    .tools-introduce__item-summary { padding: 50rem 42rem; }

    .tools-introduce__item-content { padding: 50rem 42rem 50rem 232rem; }

    .tools-introduce__infolist-title { margin-bottom: 16rem; }
    .tools-introduce__infolist > li > ul { gap: 16rem; }
    .tools-introduce__infolist > li > ul > li:before { top: 11rem; }

    .tools-introduce__datalist { gap: 24rem; }
    .tools-introduce__datalist-title { margin-bottom: 18rem; }
    .tools-introduce__datalist--secondary > li { padding-top: 25rem; }

}



/* **************************************** *
 * 860px
 * **************************************** */
@media (max-width: 860px){

    /* SOFTWARE & DESIGN TOOLS */
    .tools-introduce { gap: 55rem; }

    .tools-introduce__item-head { grid-template-columns: 165rem 1fr; }
    .tools-introduce__item-summary { padding: 40rem 32rem; }
    
    .tools-introduce__item-content { gap: 45rem; padding: 38rem 30rem; }
    
    .tools-introduce__infolist { gap: 35rem; }
    .tools-introduce__infolist-title { margin-bottom: 14rem; }
    .tools-introduce__infolist > li > ul { gap: 14rem; }

    .tools-introduce__datalist { gap: 12rem; }
    .tools-introduce__datalist-title { margin-bottom: 16rem; }
    .tools-introduce__datalist--secondary > li { padding-top: 22rem; }
    
}



/* **************************************** *
 * 540px
 * **************************************** */
@media (max-width: 540px){

    /* SOFTWARE & DESIGN TOOLS */
    .tools-introduce { gap: 48rem; }

    .tools-introduce__item-head { grid-template-columns: 1fr; }
    .tools-introduce__item-name { justify-content: flex-start; padding: 12rem 20rem; }
    .tools-introduce__item-summary { padding: 24rem 20rem; }

    .tools-introduce__item-content { gap: 30rem; padding: 24rem 20rem 30rem; }

    .tools-introduce__infolist { gap: 30rem; }
    .tools-introduce__infolist-title { margin-bottom: 12rem; }
    .tools-introduce__infolist > li > ul { gap: 10rem; }
    .tools-introduce__infolist > li > ul > li:before { top: 10rem; }

    .tools-introduce__datalist { grid-template-columns: 1fr; gap: 24rem; }
    .tools-introduce__datalist-title { margin-bottom: 10rem; }
    .tools-introduce__datalist-buttons { gap: 5rem; }
    .tools-introduce__datalist--secondary { padding-top: 30rem; border-top: 2rem solid var(--color-black); }
    .tools-introduce__datalist--secondary > li { padding-top: 0; border-top: none; }

}